الإدارة العامة لتنمية 
مادة الكمبيوتر وتكنولوجيا المعلومات مركز تطوير المناهج والمواد التعليمية 


الكمبيوتر وتكنولوحيا 
المعلومات والاتصالات 


الصف الثاني الإعدادي 
الفصل الدراسي الأول 


۲۰۱۷-0 م 


وزارة التربية والتعليم 


الكمبيوتر وتكنولوحيا المعلومات والاتصالات 
الصف الثاني الإعدادي 
الفصل الدراسي الأول 


إعداد 
د / أماني قرني إبراهيم د/ طاهر عبد الحميد العدلي 
مدير عام تنمية مادة خبير مناهج ورئيس قسم الكمبيوتر وتكنولوجيا 
الكمبيوتر وتكنولوجيا المعلومات المعلومات بمركز تطوير المناهج 


أ. عبير حامد أحمد م. وسيم صلاح الدين المنزلاوي 
مدير إدارة بالإدارة العامة لتنمية مادة مدير إدارة بالإدارة العامة لتنمية مادة 
الكمبيوتر وتكنولوجيا المعلومات الكمبيوتر وتكنولوجيا المعلومات 
أ. تامر عبد المحسن منصور 
مدير إدارة بالإدارة العامة لتنمية مادة 
الكمبيوتر وتكنولوجيا المعلومات 


مراجعة تربوية 
أ.د/ الغريب زاهر إسماعيل 
أستاذ تكنولوجيا التعليم 
ووكيل كلية التربية جامعة المنصورة 


مراجعة علمية 
أ.د/ محمد فهمي طلبة 
أستاذ بكلية الحاسبات جامعة عين شمس 
والوكيل السابق لكلية الحاسبات جامعة عين شمس 


١‏ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


مقدمة الكتاب 


يعتبر التعليم في ظل العصر الذي نعيش فيه عاملاً حاسماً في تحديد مصير عالمنا: دولاً 
وأفراداًء مما فرض ضرورة مجاراة المؤسسة التعليمية للتقدم التكنولوجي والعلمي. وقد نتج عن 
هذا تغيرفي معايير تقييم المجتمعات وفقا لمدى تطورها تكنولوجيا ومعلوماتيا وقدرتها على التحول 


ونحن على ثقة في أننا نملك من العقول والقدرات والطاقات ما يبلغنا ذلك الحلم ... فقط 
نحتاج إلى العمل الدؤوب لاستثمار طاقتنا وإمكاناتنا المتاحة والعمل على اكتشاف الموهوبين 
والمبدعين من أبنائناء وتستند فلسفة مادة الكمبيوتر وتكنولوجيا المعلومات والاتصالات إلى إتاحة 
بدائل متنوعة من البرمجيات ومن ثم فقد تم اختيار برمجيات مفتوحة | صد OPEN SOURCE‏ 
تعمل تحت نظام التشغيل نوافذ W۷|N00۷W5S(‏ 105) وكذلك أنظمة التشغيل الأخرى» بما يحقق 
التسلسل المنطقي في ترتيب المحتوى العلمي وبراعي الجوانب المتكاملة لشخصية المتعلم في ضوء 
المعاييروالمؤشرات المتضمنة بمصفوفة المدى والتتابع للمادة. 


يتكون الفصل الدراسي الأول من وحدتين. وتتضمن الوحدة الأولى (مواقع الويب) مفاهيم 
وا اساك مراف الوب كلك مراخل تمم وإنقاء مواقم الويب وايضاً انشاء ومغالجة ملقات 
الحجوت: والفيديو عنما تتضمن الوجدة الكانية: تضم واققنام واف الويت «استخداء اة 
التزمين ا وى بمضروع عطبيق التصيملم مؤقع ونب من [بداع الطالب من خلال فق مدخل 
المشروعات بهدف تنمية قدرات المتعلمين على الإبداع والابتكار وبتم تقويم أداء المتعلم عن طريق 
بعض الأنشطة والمشروعات. لتعزيز اتجاهات ومهارات التعلم الذاتي » وصولاً إلى مجتمع دائم 
التعلّم. 


والله الموفق 6 66 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۲ 


وزارة التربية والتعليم 


أضداف كتاب الكمبيوتر تكلولوجيا المعلومات 
والإتصالات للصف الثاني الإعدادي 


تعرف بعض العمليات والمفاهيم الخاصة بإنننناء صفحات 
الويب. 

تعرف بعض المفاهيم والعمليات الأساسية لخدمات 
وتطبيقات تكتولوجيا المعلوهات والإتصالات.. 

فهم بعض جواتب الأمن الفكري المتعلقة باستخدام 
تكنولوجيا المعلومات والإتصالات. 

استخدام أدوات الإنتاج التكنولوجي (لفة 51 - الوسائط 
المتعددة "صوت صورة فيديو") في دعم تعلمك. 

إتتاج متتتروع (تصميم موقع ويب) باستخدام العمليات 
والبرامج والأدوات التكنولوجية. 


توظيف أدحوات الإتصال التكنولوجية فى تبادل المحتوى 


والرؤى مع الآخرين. 
استخدام المصادر الإلكترونية في التعامل مع المعلومات. 
استخدام الأدوات التكنولوجية في معالجة البيانات 


وتقييمها وإعداد تقارير بالنتائج. 


5 الصف الثاني الإعدادي 


وزارة التريية والتعليم 


الوحدة الأولى: (مواقع الويب). 
- الموضوع الأول: مفاهيم وأساسيات مواقع الويب. 
- الموضوع الثاني: مراحل تصميم وإنشاء موقع الويب. 
- الموضوع الثالث: إنشاء ومعالجة ملفات الصوت. 


- الموضوع الرابع: إنشاء ومعالجة ملفات الفيديو. 


الوحدة الثانية: (تصميم وإنشاء مواقع الويب). 


- الموضوع الأول: لغة الترميز 11/1!!. 


- الموضوع الثاني: مشروع تطبيقي لتصميم موقع ويب. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات 


وزارة التربية والتعليم 


الوحدة الأولى 


هواقع الويب 
في نهاية الوحدة يتوقع أن يكون الطالب قادرا على أن: 
ا- يتعرف يعض المفاطضيم والمصطلحات العلمية الأساسية لتكنولوجيا 
المعلومات (مواقع الويب - صفحة الويب ...). 
)- يمارس العمليات الأساسية للتعامل مع تطبيقات تقتيات المعلومات 


والإتصالات. 


بعس 1 ممه مكلك | 
EEE‏ 


@ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


الموضوع الأول 
مغاهيم وأساسيات مواقع الويب 


في نضاية الموضوع يتوقع أن يكون الطالب قادرا على أن: 


يتعرف مفهوم (موقع الويب/ صفحة الويب/ الصفحة الرئيسة). 
يستنتج مكونات موقع الوبب. 
يوضح عناصر صفحة الويب (نص - صورة - فيديو - ارتباط تشعبي. ..). 


يتعرف أنواع صفحات الويب المختلفة (صفحة الويب الثابتة - صفحة الويب التفاعلية). 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات , 


وزارة التربية والتعليم 


Web Sites مواقع الويب‎ 


عزيزي الطالب/ أثناء تصميمك (إنشاؤك) لموقع ويب ينبغي أن تتعرف على بعض المفاهيم الأساسية مثل: 
موقع الويب: 
عبارة عن صفحة ويب 5306 هلالا أو أكثر مترابطة مع بعضها تحت اسم معين» موقع الويب له عنوان 
علي شبكة الإنترنت يسمي بعنوان الموقع 8001655 هلالا . ويمكن زيارة موقع الويب من خلال 


الكمبيوتر أو الهاتف المحمول. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بتحميل موقع وزارة التربية والتعليم 
http://www .1110© . 001 . 60‏ ثم بمساعدة معلمك وبمشاركة زملائك تناقش فيما يلى : 


موقع الويب ا EEO‏ 


صفحة الويب yT‏ 


الصفحة الرئيسة ا 5 


۷ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


موقع وزارة التربية والتعليم 


موقع الويب: 

عبارة عن صفحة ويب 5306 ط٠‏ أو أكثر مترابطة مع بعضها تحت اسم معين» موقع الويب له عنوان ١‏ 
علي شبكة الإنترنت يسمي بعنوان الموقع 8001655 هلالا . ويمكن زيارة موقع الويب من خلال 
الكمبيوتر أو الهاتف المحمول. 

:Web Page صفحة الوبب‎ 

هي مستند به محتوى إلكتروني ينشر على شبكة الإنترنت ويتم عرضه من خلال برنامج مستعرض . 
الإنترنت. 

:Home Page الصفحة الرئيسة‎ 

هي أول صفحة بموقع الويب والتي من خلالها يتم الانتقال لباقي صفحات الموقع. 


١ 7 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۸ 


وزارة التربية والتعليم 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك ظ 
استنتج عناصر صفحة الويبء وأنواع البيانات المعروضة بصفحات الويب المختلفة. 


من النشاط السابق تلاحظ أن صفحة الويب تتكون من مجموعة من الصور. النصوص, الصوت. الفيديوء 
الارتباطات التشعبية.... 


وزارة التربية والتعليم 


صفحات الويب " الثابتة والتفاعلية" 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بعمل الآتى: 

- تحميل أحد مواقع الويب» ثم التجول بين صفحات الموقع. 

- التعرف على مكونات صفحات الويب الثابتة 53965 اع/الا 543616 وعناصرها ( نصوص - صور - 
لقطات فيديو ....). 

- استنتاج أنواع صفحات الويب. 


[ تا 
© ود هد ES‏ بي و6 ب 


“STEM ® 22‏ 
صفحات الويب الثابتة 


2 بي احج اکت نے‎ "51050 Web Pages” 


هناك أنواع من صفحات الويب منها صفحات الوبب الثابتة 53965 ط۷6 5143416 و صفحات الويب 

.Interactive Web Pages التفاعلية‎ 

صفحات الويب الثابتة :Static Web Pages‏ 
محتواها مُعد مُسبقا بواسطة مصمم الصفحة ويظل هذا المحتوى ثابتاء وتُستخدم صفحات 

الويب الثابتة لعرض معلومات يتم الاطلاع عليها فقط بدون إمكانية إجراء أي معالجة من الزائرين 

لمحتواهاء تُستخدم أوامر 171/1! في تصميم هذا النوع من الصفحات» وسوف نتعرض في الفصول 

القادمة لكيفية تصميم وإنشاء صفحة وبب باستخدام أوامر -171/1!. 


الكعبيوتر وتكنولوجيا المعلوعات والاتصانات ۱۰ 


وزارة التربية والتعليم 


Interactive Web Pages صفحات الوبب التفاعلية‎ 


- عزيرك الطالب يمكنك التعرف على مكونات صفحة الويب التفاعلية من خلال زيارتك لصفحة التعليم 
الالكترونى بموقع وزارة التربية والتعليم» حيث يمكنك تحديد المرحلة الدراسية والصف الدراسي للإطلاع على ٠‏ 
مناهج أحد الصفوف الدراسية كما يلى : 

- ادخل البيانات المطلوبة بصفحة الويب والضغط على زر بحث. 


والنتائج التي تظهر لك أثناء زيارتك واستخدامك لصفحات  ١‏ التعليم الالكثروتي 


و لمن 
الويب. ١‏ 
5 اخترالمرحلة اللعليمية ظ 
همر الفصن الدرإساي 
اف الصف المراسي 
| إخترالبوعية 


ةويسي| كا | 


- قم بتحميل صفحة 'تواصل معنا" 'بموقع وزارة التربية والتعليم' والتي تطلب منك إدخال بعض البيانات. 

- ادخل البيانات المطلوبة بصفحة الويب ثم اضغط 
على زر تسجيل دخول. 

- دون ملاحظاتك والنتائج التي تظهر لك. 


| 
فم القومي 
بخ الميلاد سنة المي شهر بو 
صفحات الوبب التفاعليه EE:‏ 
انوع اختر 


۱۱ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بتحميل أحد المواقع التالية: 


- موقع الهيئة العامة للاستعلامات http://www.sis.gov.e‏ 


- موقع جريدة الأهرام http://www.ahram.org.e‏ 


٠‏ من خلال تجولك على أحد المواقع السابقة دون ملاحظاتك عن: 
- التعرف على الصفحة الرئيسة للموقع. 
- تحديد عناصر صفحات الويب ( نصوص - صور- فيديو- ارتباطات تشعبية....). 
- تحديد صفحات الويب الثابتة. 


- تحديد صفحات الوبب التفاعلية. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ١‏ 


وزارة التربية والتعليم 


موقع الويب: 

عبارة عن صفحة ويب 5306 اعلالا أو أكثر مترابطة مع بعضها تحت اسم معينء موقع الويب له 
عنوان علي شبكة الإنترنت يسمي بعنوان الموقع 8007655 ط٠۷‏ » ويمكن زيارة موقع الويب من خلال 
الكمبيوتر أو الهاتف المحمول. 


صفحة الويب: 
هي مستند به محتوى إلكتروني ينشر على شبكة الإنترنت ويتم عرضه من خلال برنامج مستعرض 
الإنترنت. 


الصفحة الرئيسة: 


هي أول صفحة بموقع الويب والتي من خلالها يسهل الانتقال لباقي صفحات الموقع. 


صفحات الويب الثابتة: 

محتواها مُعد مُسبقا بواسطة مصمم الصفحة ويظل هذا المحتوى ثابتا في كل مره يتم فيها زيارة 
الصفحةء تستخدم لعرض معلومات يتم الاطلاع عليها فقط بدون إمكانية إجراء أي معالجة من الزائرين 
لمحتواهاء نُستخدم أوامر ا1۲۷ في تصميم هذا النوع من الصفحات. 
صفحات الوبب التفاعلية: 


هي صفحة معلومات تعرض محتوى يتيح للزائرين التفاعل معه ومعالجته, يُستخدم لتصميم هذا النوع 
من الصفحات أوامر ا1۲۷ بالإضافة للغات أخرى مثل لغة 4م20/25611لء, لغة ۶۴۳١۲‏ وغيرها. 


١‏ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


السؤال الأول: أكمل العبارات التالية: 


حمل موقع وزارة الإتصالات وتكنولوجيا المعلومات Fڵ0/.eg/aټciİ.g WWW.‏ 


- تعرف على الصفحة الرئيسة للموقع. 
- حدد محتويات الصفحة الرئيسة للموقع (نصوص - صور- فيديو- ارتباطات تشعبية....). 
- حدد هل الصفحة الرئيسة للموقع صفحة ويب ثابتة أم صفحة ويب تفاعلية. 


- تجول داخل صفحات الموقع للتعرف على محتويات كل صفحة» وحدد هل هى صفحة ويب ثابتة أم 


يتم الإجابة على الأسئلة باستخدام: 
MS Word >‏ 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۱٤‏ 


وزارة التربية والتعليم 


الهوضوع الثاني 


مراحل تصميم وانتنتناك 


موقع ألويب 
في لهاية الموضوع يتوقع أن يكون الطالب قادرا على أن: 


- يوضح مراحل تصميم وإنشاء موقع الويب 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات 15 


مراحل تصميم وإنشاء موقع ويب 


تصميم وإنشاء موقع الويب يمر بعدة مراحل يمكن تلخيصها في التالي: 
المرحلة الأولى: التخطيط لبناء موقع الويب. 


المرحلة الثانية: تصميم صفحات الويب للموقع. 
المرحلة الثالثة: الإعداد والتجهيز لصفحات الويب. 
المرحلة الرابعة: مرحلة تنفيذ صفحات الويب. 


المرحلة الخامسة: نشر الموقع عبر الانترنت. 


مراحل تصميم وإنشاء موقع ويب 


وزارة التربية والتعليم 


المرحلة الأولى: التخطيط لبناء موقع الويب 


- يتم في هذه المرحلة عمل رسم تخطيطي بسيط على الورق يتضمن صفحات الموقع (الصفحة الرئيسة 
للموقع وصفحات الوبب المرتبطة بها). 
- تحديد البيانات والمعلومات التي تتضمنها صفحات الويب كمعلومات وخدمات تقدم من خلال الموقع حسب 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بوضع تخطيط عن الموقع المطلوب تصميمه 
وانشاء ه من حيث: 
- الاسم والموضوع الذي سوف يُعرض من خلال الموقع. 


- تحديد صفحات الموقع (الصفحة الرئيسة وباقي صفحات الموقع). 


- وضع تخطيط للصفحة الرئيسة وباقي صفحات الموقع؛ تحديد البيانات والمعلومات التي سوف تظهر بها. 


الرؤية والرسالة 


رسم تخطيطي لصفحات موفع ويب "موقع مدرستي" 


الكعبيوتر وتكنولوجيا المعلوهمات والاتصانات ۱۸ 


وزارة التربية والتعليم 


المرحلة الثانية: تصميم صفحات الموقع 


هذه المرحلة من أهم المراحل وفيها يتم: 
- تصميم شكل الصفحة الرئيسة وصفحات الموقع. 
- تحديد التنسيقات المختلفة لصفحات الويب مثل لون الخلفية» حجم الخط لونه؛ نوعه» أماكن وضع 


النصوص. الصور. ولقطات الفيديو بصفحات الوبب. 
- تحديد الارتباطات التشعبية داخل الصفحة الرئيسة وصفحات الموقع. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بعمل التالي: 
- تصميم شكل الصفحة الرئيسة وصفحات الويب للموقع. 
- تحديد الارتباطات التشعبية بين صفحات الويب للموقع. 
تحديد أماكن وضع النصوص والصور ولقطات الفيديو بصفحات 
الويب المختلفة. ظ 


al 


ج ڪڪ سے ] 


۱۹ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


المرحلة الثالثة: الإعداد والتجهيز 


تتضمن مرحلة الإعداد والتجهيز عدة خطوات هامة وهى: 


- من خلال أحد منسقات النصوص يتم إعداد وتجهيز البيانات النصية التي سوف توضع في صفحات 


الويب» حفظ النص داخل ملف نصي ووضعه داخل مجلد. 

- إعداد وتجهيز ملفات الصور وحفظها داخل مجلد. 

- إعداد وتجهيز ملفات الصوت والفيديو وحفظها داخل أحد المجلدات» وسوف يتم تناول إنشائها وحفظها 
لاحقا. 


١-إعداد‏ وتجهيز النصوص 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بالتالي: 

- تحديد النصوص المطلوبة لكل صفحة ويب بالموقع من خلال مرحلة 
التصميم لصفحات الموقع المطلوبة من خلال الإنترنت أو من خلال 
الإدارة المدرسية مثل: 


- تاريخ نشأة المدرسة:... - عنوانها: ... 
- رقم التليفون: ... - الرؤية والرسالة الخاصة بالمدرسة: ... 


- البحث عن البيانات النصية اللازمة لصفحات الويب المختلفة. 
- كتابة النصوص وحفظها داخل ملف نصي داخل أحد المجلدات. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات 3 


وزارة التريية والتعليم 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بعمل التالي: 

- التقاط مجموعة من الصور لمدرستك من فصول ومعامل وملاعب... . 

- تجميع صور عن الأنشطة التي تقدمها المدرسة والمسابقات التي اشتركت بهاء صور الشهادات والجوائز 
التي فازت بها المدرسة. 

- حفظ الصور كملفات داخل أحد وحدات التخزين. 


صور للأنشطة المختلفة للمدرسة 


۲١‏ الصف الثاني الإعدادي 


جزارة التربية وانتعليم 


خطوات تنفيذ النشاط 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بالآتي: 


- التقاط صور لمعامل وملاعب المدرسة باستخدام الكاميرا الرقمية 

أو باستخدام الموبايل. 

- تجميع صور عن الأنشطة التي يمارسها الطلاب داخل المدرسة. 

- تجميع صور عن المسابقات التي تم الاشتراك بها سواء داخل المدرسة أو على مستوى الإدارة التعليمية أو 
الإدارات التعليمية. 

- تجميع صور عن الشهادات والجوائز التي فازت بها المدرسة. 

- ادخال الصور للكمبيوتر (باستخدام الماسح الضوئي - كابل الاتصال بين الموبايل والكمبيوتر-....). 
إنشاء مجلد "7701" داخل أحد وحدات التخزين» حفظ ملفات الصور به. 


- عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك تعرف على بعض أنواع ملفات 
الصور. 

- البحث عبر الإنترنت عن أنواع ملفات الصور ذات الامتداد-15لما8- اق -۴P6ل‏ 
6 ومناقشة الفرق بين أنواع ملفات الصور المختلفة. 


*“-إعداد وتحهيز ملفات الصوت وملفات الفيديو : 


لإعداد وتجهيز ملفات الصوت والفيديو وحفظها سوف يتم تناول ذلك لاحقا في الفصول التالية. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۲۲ 


وزارة التربية والتعليم 


- هي مرحلة تحويل التصميم الورقي بالمراحل السابقة إلى صفحات ويب يمكن عرضها من خلال أحد برامج 
متصفحات الإنترنت. 
- إضافة البيانات (نصوص - صور - صوت - فيديو....) في صفحات الويب. 
- إنشاء الارتباطات التشعبية بين صفحات الويب حتى يسهل التنقل بين صفحات الموقع» ويتم كل ذلك 
باستخدام لغات برمجة وأوامر ا1۲۷ وهو ما سوف نتناوله بالشرح تفصيلياً لاحقا. 


وهذه المرحلة تتضمن حجز عنوان للموقع, تخصيص مساحة تخزبنية للموقع على أحد أجهزة الخادم, 
نشر الموقع عبر الإنترنت وإعداده للعمل بشكل صحيح. 
شكل 0 ال 'موقع مدره تي" 


مدرسدي 


الصفحة الرنيسة عن المدرسة آليوم الصور الرؤية والرسالة 


وزارة التربية والتعليم 


تصميم وإنشاء موقع الويب يمر بعدة مراحل هي: 

المرحلة الأولى: التخطيط لبناء موقع الويب: 

- وضع مخطط بسيط على الورق للصفحة الرئيسة وصفحات الويب للموقع. 
- تحديد البيانات والمعلومات التي تتضمنها صفحات الويب. 

المرحلة الثانية: تصميم شكل الصفحة الرئيسة وصفحات الويب وتنسيقها: 

- تصميم شكل الصفحة الرئيسة وصفحات الويب. 

ب ون ا 

- تحديد أماكن وضع النصوص والصور ولقطات الفيديو بصفحات الويب. 

- تحديد الارتباطات التشعبية داخل صفحة الويب وصفحات الموقع. 

المرحلة الثالثة: الإعداد والتجهيز: 


- الإعداد والتجهيز لملفات النصوص. الصورء الصوت. الفيديو وحفظها داخل أحد المجلدات. 


المرحلة الرابعة: مرحلة التنفيذ: 


باستخدام أحد لغات البرمجة وأوامر ١171/1‏ يتم: 
- تحويل التصميم إلى صفحات ويب. 
- وضع البيانات (نصوص - صور - صوت -فيديو) في صفحات الويب. 
- إنشاء الارتباطات التشعبية لصفحات الموقع. 
المرحلة الخامسة: نشر الموقع عبر الانترنت: 
- حجز عنوان للموقع» تخصيص مساحة تخزينية له على أحد أجهزة الخادم لنشر الموقع. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات 


٤ 


وزارة التربية والتعليم 


السؤال الأول: أكمل 
أولا: تصميم وإنشاء موقع الويب يمر بعدة مراحل هي: 
١‏ 


يتم عمل التالي: 


ween 
قوفف فوم و ف و ووو ووو ووو ووو وو ووو ووو ووو و6‎ 


١‏ وقفف ف وو ف و وو وو و و ووو ووو ووو ووو ووو ووو وو ووو ووو ووو 


يتم الإجابه على الإسئله من خلال 


برنامج ١/15 ۷0١١‏ من ملف 'إجابة الدرس الأول" بمجلد ( قالب الإجابة والمشروعات). 


o‏ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


وزارة التربية والتعليم 


الموضوع الثالث 
اتتتناك ومعالجة ملقات الصوت 


الأهداف 


في نهاية هذا الموضوع يتوقع أن يكون الطالب قادرا على أن: 


٠‏ يتعرف برنامج إنشاء ومعالجة الصوت. 

« يعد / يُجهز (البيانات / المكونات البرمجية والمادية) لإنشاء الصوت. 

٠‏ يستخدم برنامج 8101013616 لإنشاء ومعالجة ملفات الصوت. 

. ) ... - يجرى عمليات المعالجة لمقاطع الصوت ( إضافة تأثير - حذف‎ ٠ 


٠‏ يتعرف أنواع امتداد ملفات الصوت. 


۷ الصف الثاني الإعدادي 


وزارة التريية والتعليم 


برامج إنشاء ومعالجة ملفات الصوت 


هناك العديد من اليرامج التي تستخدم في التعامل مع ملفات الصوت وثمكن المستخدم من إنشاء 
ومعالجة ملفات الصوت بطرق سهلة وجيدة من خلال مجموعة من الأدوات التي تساعده في ذلك. 
إنشاء ملف صوت: 
يمكن إنشاء ملف صوت يحتوي على المقاطع الصوتية المطلوبة وإضافة التأثيرات المختلفة على 
المقطع الصوتي» ثم حفظ الصوت داخل ملف» ولإنشاء الملف الصوتي نحتاج إلى أحد برامج معالجة الصوت› 
وسوف نقوم بإنشاء ملف صوتي باسم 'مدرستي' به تعليق صوتي عن أحد أنشطة المدرسةء لإدراجه في 
لقطة فيديو عن المدرسة. 


أولاً: مرحلة الإعداد والتجهيز لإنشاء ملف صوت 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بإنشاء ملف صوتى عن المدرسة بتنفيذ 
الخطوات التالية: 
١-الإعداد‏ والتجهيز بيانات عن مدرستك منها: 
” اسم المدرسة: ... الإدارة التعليمية التابعة لها المدرسة: . 
> المسابقات التي اشتركت بها: O E‏ 
” المراكز التي حصلت عليها بتلك المسابقات: 0 
” شهادات التقدير التي حصلت عليها المدرسة............ 
” الأنشطة الصيفية التي تقدمها: ا 0 
” الرحلات المدرسية والأنشطة المختلفة التي تقدمها: 00 
- كتابة البيانات التي تم تجميعها عن المدرسة في أحد برامج منسقات النصوص وتنسيقها. 
- حفظ البيانات النصية داخل ملف نصي. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۲۸ 


وزارة التربية والتعليم 


؟- الإعداد والتجهيز للبرمجيات: 
عزيزى الطالب : بمساعدة معلمك وبمشاركة زملائك قم بالتالى: 


- التأكد من تثبيت أحد برامج إنشاء ومعالجة الصوت على 
أجهزة الكمبيوتر بالمعمل. 

- التأكد من توصيل الميكروفون i٥”‏ ” بجهاز 
الكمبيوتر. 

- التأكد من توصيل السماعات ”5/,عا 5062 ” 


بجهاز الكمبيوتر. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بإنشاء ملف صوتي عن مدرستك من خلال 
أحد برامج إنشاء ومعالجة الصوت كالتالى: 
- تحميل أحد برامج إنشاء ومعالجة الصوت. 


- تسجيل الصوت من خلال البرنامج. 
- قراءة البيانات النصية التي سبق إعدادها وادخالها للكمبيوتر باستخدام الميكروفون كوحدة إدخال. 


- تشغيل الصوت بعد الانتهاء من تسجيله والاستماع إليه من خلال السماعات. 


خطوات تنفيذ النشاط: 


- استخدام برنامج "81103618 ' لإنشاء ومعالجة الصوت وهو أحد البرامج مفتوحة المصدرء وهو برنامج 


يمكنه أن يعمل على أنظمة تشغيل مختلفة مثل (.... .(Windows - Linux‏ 


- يمكن إنزال البرنامج من خلال الموقع http://audacity.sourceforge.net/‏ 
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Stopped. 


واجهة برنامج ةكد (لإنشاء ومعالجة الصوت) 


وزارة التربية والتعليم 


- لبدء التسجيل الصوتي يتم الضغط على زر تسجيل )( button‏ ۵ حيث يصبح البرنامج في 
وضع تسجيل الصوت. 
- قراءة البيانات التي تم تجميعها عن المدرسة في الملف النصي بإستخدام الميكروفون '1/16' كوحدة 


الشريط الزمني للبرنامج حيث يظهر به الصوت 


- للانتهاء من ادخال البيانات الصوتية يتم الضغط على زر الإيقاف "5100 © 


- للاستماع إلى الصوت الذي تم إدخاله بالضغط على زر التشغيل 5131" ® 


وزارة التربية والتعليم 


ثالثاً: التعديل في الصوت (أو بمقطع الصوت) 


بعد الاستماع إلى الصوت الذي تم تسجيله قد يكون هناك الحاجة إلى إضافة تأثيرات على الصوت (أو 


مقطع صوتي). حذف أو قص جز من الصوت (مقطع صوتي)» ولصقه في مكان آخر في مقاطع الصوت. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بإضافة تأثير للصوت أو لمقطع بالصوت كالتالي: 


- تشغيل الصوت بالضغط على زر التشغيل (2]) رها۴ والاستماع إليه. 


- تحديد مقطع الصوت المطلوب إضافة التأثير له وذلك بالضغط والسحب على الجزء المطلوب بالصوت 
بإستخدام مؤشر القراءة على الشريط الزمني. 


الشريط الزمني للبرنامج ويظهر به الصوت 


-0 
Stereo, 44100141 
32-61 float 

Mute Solo 


- من قائمة 15788614 يتم اختيار أحد التأثيرات المطلوبة. 


- إعادة تشغيل الصوت من زر التشغيل والاستماع إلى الصوت (مقطع الصوت) بعد إضافة التأثير. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۳۲ 


وزارة التربية والتعليم 


إرسس ) لإضافة تأثيرات أخري على الصوت (أو أحد مقاطع الصوت). 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بالآتي: 

- تحديد مقطع الصوت وإضافة أحد التأثيرات عليه مثل تأثير التكرار '8606©24". 
- تشغيل الصوت والاستماع إليهء استنتاج الغرض من هذا التأثير. 

نلاحظ: عند اختيار تأثير التكرار'560621" يتم تكرار المقطع المحدد. 


لإضافة تأثيرات أخري على الصوت (أو أحد مقاطع الصوت). 


- عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بالآتي: 
- تحديد مقطع الصوت واضافة أحد التأثيرات عليه مثل تأثير الانعكاس "8610©:56". 
- تشغيل الصوت والاستماع إليه ومحاولة الاستنتاج الغرض من هذا التأثير. 


نلاحظ: عند اختيار تأثير عكس "۸٠۷٠۲56"‏ يتم عكس بداية المقطع مع نهايته. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم باختيار باقي التأثيرات 
واضافتها إلى أحد مقاطع الصوت. 


- تشغيل الصوت والاستماع إليه ومحاولة استنتاج الغرض من كل تأثير. 


وزارة التربية والتعليم 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بقص جزء من الصوت (مقطع صوتي) ولصقه في 
مكان آخر بين مقاطع الصوت كالتالي: 
- تحديد المقطع الصوتي المطلوب نقله » من قائمة 2014 اختيار 4لا 6. 


- تحريك مؤشر القراءة بالشريط الزمني إلى المكان المطلوب عمل لصق للمقطع الصوتي عنده» من قائمة 


. Pase يتم اختيار‎ E٤ 
إعادة تشغيل الصوت من زر التشغيل والاستماع إليه.‎ - 


وزارة التربية والتعليم 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك فم بحذف جزء من الصوت (مقطع صوتي) كالتالي: 
- تحديد المقطع الصوتي المطلوب حذفه. 
- الضغط على مفتاح "061616" من لوحة المفاتيح فيتم حذف المقطع الصوتي الذي تم تحديده. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بتصدير ملف صوت بامتداد مناسب كالتالي: 


- تصدير ملف الصوت من خلال قائمة File‏ اختيار .Export Audio‏ 
- تحديد الامتداد المناسب لملف الصوت. 
- حفظ ملف الصوت داخل مجلد "57201". 


7 الصف الثاني الإعدادي 


وزارة التربية والتعليم 


هناك أنواع مختلفة لامتداد ملفات الصوت مثل ۷۷۸۷ء 21153 ... وهي تختلف في جودة ونقاء الصوت 


والمساحة التخزينية وعلى حسب الحاجة يتم استخدام امتداد الملف المناسب. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بالتالي: 


- التعرف على الأنواع المختلفة لامتداد ملفات الصوت أثناء تصديرها كملف صوت. 
- تصدير ملف الصوت بامتداد ۷۸۷ ثم تصدير الملف مرة أخري بامتداد 1/153. 
- المقارنة بين ملفي الصوت ذات الامتداد /الثلالاء والامتداد 53الاا من حيث: 


5" جودة الصوت ووضوحه ونقائه 
- من خلال الإنترنت يتم القيام بالبحث عن أنواع ملفات الصوت ذات الامتدادات المختلفة. 
- تجميع البيانات والمعلومات عن أنواع ملفات الصوت ذات الامتدادات المختلفة في أحد برامج منسقات 
النصوص. 
- يناقش المعلم الطلاب في نتائج بحثهم. 


وزارة التربية والتعليم 


- ملف الصوت ذو الامتداد ۷۸۷ يتميز فيه الصوت بالجودة والوضوح» له سعة تخزبنية كبيرة» لذا فهو 


غير ملائم للنشر عبر مواقع الويب. 
- ملف الصوت ذو الامتداد 1/53 يكون فيه الصوت أقل نقاء بالمقارنة مع الملف ذو الامتداد ۸۷ له 


سعة تخزينية أقل, لذا فهو ملائم للنشر عبر مواقع الويب. 


۳% الصف الثاني الإعدادي 


وزارة التربية والتعليم 


لإنشاء ملف صوت يتم اتباع التالي: 


أولاً: الإعداد والتجهيز: 
- جمع البيانات التي سوف يتم تسجليها صوتيا. 
- التأكد من تثبيت أحد برامج إنشاء ومعالجة الصوت على أجهزة الكمبيوتر بالمعمل. 
- التأكد من توصيل الميكروفون ۸1٥”‏ ” و السماعات "506231615" بجهاز الكمبيوتر. 
ثانياً: التنفيذ لإنشاء ملف الصوت: 
تحميل أحد برامج إنشاء ومعالجة الصوت. 
البدء في تسجيل الصوت وبتم بالضغط علي زر التسجيل "56©6010". 
استخدام الميكروفون لإدخال البيانات الصوتية. 
للانتهاء من ادخال البيانات الصوتية يتم الضغط على زر الإيقاف "5600 ". 
لتشغيل الصوت بالضغط على زر تشغيل "/ا513"» الاستماع إلى الصوت من خلال السماعات. 
| ثالثاً: التعديل في الصوت: 
- إضافة تأثيرات على مقطع صوتي. 
- قص ولصق مقطع صوتي. 
- حذف مقطع صوتي. 
رابعاً: تصدير الصوت إلى ملف: 


- تصدير الصوت إلى ملف صوت بامتداد مناسب. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۳۸ 


وزارة التربية والتعليم 


الأسيله والنارييان 2 


السؤال الأول:أكمل التالي: OD‏ 


لإنشاء ملف صوت يتم اتباع التالي: 


اختر أحد الموضوعات الدراسية لأحد المواد الدراسية. 
جمع بيانات حول الموضوع الدراسي. 

حمل أحد برامج إنشاء وتعديل ملفات الصوت. 

انشئ ملف صوتي حول الموضوع الدراسي. 

صدر ملف الصوت بامتداد مناسب. 


يتم الإجابة على الأسئلة من خلال: 


MS Word z7 


۳۹ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


وزارة القربية والتعليم 


الموضوع الرايع 
إلنتناك ومعالجة ملفات 


٤١‏ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


الأهداف 


في لهاية هذا الموضوع يتوقع أن يكون الطالب قادرا على أن: 
يتعرف بعض برمجيات معالجة ملفات الفيديو. 
يستورد ملفات (صور/ صوت) لبرنامج إنشاء ومعالجة ملفات الفيديو 006151104. 
ينشئ مشاهد فيديو داخل برنامج معالجة ملفات الفيديو. 
يعدل في مشاهد الفيديو. 
يحفظ ملف مشروع الفيديو. 
يضيف (تأثيرات / مراحل انتقالية/ نص) لمشاهد الفيديو. 


يصدر الفيديو إلى ملف بامتداد مناسب. 


الكعبيوتر وتكنولوجيا المعلومات والإتصالات ٤‏ 


وزارة التربية والتعليم 


برامج إنشاء ومعالجة ملفات الفيديو 


برامج إنشاء ومعالجة الفيديو هي تلك البرامج التي تُمكن المستخدم من إنشاء وتعديل ملفات الفيديو 


من خلال احتوائها على العديد من الأدوات والوسائل والتأثيرات التي تساعد المستخدم في إنشاء ومعالجة 


لقطات الفيديو بطريقة سهلة وسريعة. 


ولإنشاء أحد ملفات الفيديو لمجموعة من الصور التي تم التقاطها أو معالجة مشاهد فيديو تم تسجيلها 
من خلال كاميرا الفيديو أو كاميرا الويب يجب استخدام برنامج يتم من خلاله تجزئة هذا الفيديو إلى مجموعة 
من اللقطات الثابتة والتي بتسلسلها وتمريرها بسرعة محددة يهيئ الإحساس البصري بالحركة» وهذه اللقطات 
تصبح متاحة لإنشاء وتعديل محتواها ويذلك يمكن تعديل الفيديوء وهناك العديد من البرامج التي يمكن 
الاستعانة بها في إنشاء وتعديل ملفات الفيديو مثل: 


برنامج '10601106". ويرنامج '006151101" وهى برامج مفتوحة المصدر "Open Source"‏ 
تستخدم لإنشاء ومعالجة ملفات الفيديو ويمكنها أن تعمل من خلال نظام التشغيل <انا(اأ-ا و نظام التشغيل 
Windows"‏ وهناك برنامج "1/131 م۷1٥"‏ والذي يعمل من خلال نظام التشغيل "1001/5 |لالا", ومن 


خلال الانترنت يمكن تحميل أحد برامج إنشاء ومعالجة الفيديو. 


۳ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


تحميل برنامج إنشاء ومعالجة الفيديو والتعرف على واحهته 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بتحميل برنامج 006075104" لإنشاء 
ومعالجة الفيديو والتعرف على واجهة البرنامج. 


خطوات تنفيذ النشاط: 


- تحميل برنامج '0061751014" لإنشاء ومعالجة الفيديو. 


١‏ ْ أ برنامج 
- ويمكن الحصول عليه من الرابط http://www.openshot.org‏ 1 ) 


برنامج معالجة الفيديو "101101 1060/ا 0061511014" يستخدم لإنشاء ومعالجة الفيديو حيث يمكن 
إنتاج ملفات فيديو ذات جودة عالية من الصور والخلفيات وإضافة المقاطع الصوتية لهاء ويتميز هذا البرنامج 
بواجهة تشغيل سهلة الاستخدام» يمكن من خلالها إضافة الصور وملفات صوت بسهولة ويسرء. مع اضافة 
التأثيرات لمشاهد الفيديو والمراحل الانتقالية كفواصل بين الصور» وأيضاً اضافة النصوص إلى تلك المشاهدء 


وسوف يستخدم البرنامج في إنشاء ملف فيديو عن الأنشطة المختلفة لأحد المدارس. 


الكعبيوتر وتكنولوجيا المعلومات والإتصالات ٤4‏ 
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7 Project Files Transitions Effects 
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` 00:00:01 @ لورفا‎ 
١ 2 
Track 4 1 


Track 3 


.Naiہ‎ 1001231 -الشربط الرئيس‎ ١ 

.Project F۴i|e5 "-ملفات المشروع‎ 

۳-تبوبب الوظائف 131 ١٥ااءمس۴‏ (للتنقل بين ملفات المشروع - ملفات الصور-ملفات الصوت). 
؛ -معاينة الفيديو .Preview Window‏ 


ه-شريط التحرير 10015831 5011. 


وزارة التريية والتعليم 


.20011 511061 -التصغير والتكبير‎ ٦ 
.Play head/Ruler /احرأس القراءة‎ 


/-الشريط الزمنی ©1!1ا110. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك: 
- اوجد أوجه التشابه والاختلاف بين واجهة برنامج 0061051104 والبرامج الأخرى التي سبق لهم استخدمها. 
- استخدم المساعد ما٠١‏ للحصول على المزيد من المعلومات حول البرنامج. 


Timeline‏ لليرنا 


00:00:39:15 


Track 4 
Track 3 


Track 2 


١-المسطرة‏ ها۴ (تظهر المدى الزمني الحالي بالشريط الزمني). 
؟ حرأس القراءة 11830 ا3ا5 (يقرأ الكليب الحالي الذي يقف عليه في الشريط الزمني ليظهر في نافذة 


۳-الكليب الحالي (قد يكون صورة أو صوت أو لقطة فيديو). 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ٤٦‏ 


وزارة التربية والتعليم 


٤‏ - المسارات 113615 (المسارات تشبه الطبقات 615/ا13. حيث يتم وضع صورة أو صوت أو لقطة الفيديو 


على المسار ويمكن استخدام عدد غير محدود من المسارات بالمشروع, ويجب ملاحظة أن المسار الأعلى له 


الأولوية في القراءة بمؤشر القراءة ليظهر ما به في الفيديو ثم يليه المسار الذي أسفله وهكذا...). 


إنشاء مشاهد فيديو (5م1!© 0ع1/10) 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بإنشاء مشاهد فيديو عن مدرستكم لتضم 
صور عن المدرسة والمعامل والملاعب التي بهاء الأنشطة والمسابقات التي اشتركت بها المدرسة. صور لأهم 
الشهادات والجوائز التي فازت بها المدرسة. 
خطوات تنفيذ النشاط: 
ولكي يتم إنشاء مشاهد فيديو عن المدرسة بسهولة ويسر يتم إتباع الخطوات التالية: 
١-استيراد‏ ملفات الصور داخل البرنامج. 
؟- ترتيب الصور على الشريط الزمني 115061106 للبرنامج. 
۳- استيراد ملف الصوت داخل البرنامج. 
؛ - معاينة الفيديو. 
١-استيراد‏ ملفات ١‏ داخل اليرنا 
- الضغط على زر استيراد ملفات ۴ في الشريط الرئيس 70015031 1/1317 واضافة الصور المطلوبة (كذلك 
يمكن استيراد الملفات من قائمة 118 ثم اختيار 5ه!1! .)Impor٤‏ 


- استيراد ملفات الصور من داخل مجلد 'مدرستي'. لتظهر في تبويب 115 1©عز200 بالبرنامج. 


۷ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


Video Preview 


® 
00:00:00:01 


Track 4 


؟-ترتيب الصور على الشريط الزمنى يي :Timeline‏ 
لتكوين مشاهد فيديو "1105© 1060/" يتم وضع وترتيب الصور على الشريط الزمني 115061176 للفيديو كما 
يلي: 


1 


© 20 seconds 


00:00:01 


Track 4 


Track 3 


'الشريط الزمني ©«ذاع1؟" 


- بالضغط مع السحب للصور التي في نافذة ملفات المشروع ”ك٠|اذ۴‏ اعهمزه٣۴“.‏ 
- يتم وضع كل صورة في المسار 71361 الخاص بها مع ترتيبها على حسب الرغبة في أولوية الظهور. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات 44 


وزارة التربية والتعليم 


Project Files 1 Video Preview 
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Effects 


© 20 seconds 


- عند وضع الصورة في المسار 17361 يتكون مشهد فيديو (5ذا© 1060/) وتظهر في نافذة معاينة الفيديو 
"Video Preview"‏ . 


- ترتيب باقي الصور في المسارات ' 7573615" على الشريط الزمني. 


۳-استيراد ملف الصوت داخل البرنامج: 
- ولجعل مشهد الفيديو أكثر جاذبية وتأثير يتم إضافة الموسيقي أو التعليق الصوتي إليه. 
- ولإضافة ملف الصوت يتم الضغط على إضافة ملف ۴ ©1511 00م بالشريط الرئيس “ai١‏ 


37 واإضافة ملف الصوت المطلوب ليظهر في تبوبب ۴|٥۴5”‏ أععزووط“. 
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Project Files 


0000-0-1 


وزارة التربية والتعليم 


بالضغط مع السحب على رمز ملف الصوت وإدراجه في أحد المسارات (كاء522). 


Project Files Video Preview 


Show All Video Audio Image 
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foject Files Transitions Effects 
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00:00:00:01 


Practice Test 1.mp3 


لے کے 


Track 4 


mm 


؛ -معاينة الفيديو: 


لعمل معاينة للفيديو يتم الضغط على زر تشغيل "/ا513" 7 في نافذة معاينة الفيديوء 
ومشاهدة الفيديو. 


File Edit Title View Help 
نت عام‎ 


Project Files Video Preview 
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Project Files Transitions Effects 


الكعبيوتر وتكنولوجيا الععلومات والاتصالات 


وزارة التربية والتعليم 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم باستيراد ملفات (الصور/ 
اصوت) داخل البنامج. 


دون ملاحظاتك (في دفترك أو من خلال أحد منسقات النصوص) عن خطوات استيراد الملفات المختلفة 


بالبرنامج. 


.Edit Toolbar 


© 17 seconds 


00:00:00:01 


يمكن إعادة ترتيب وضع مشاهد الفيديو (الصور/ الصوت بالمسارات) من خلال الضغط والسحب 
عليها وترتيبها على المسارات وذلك حسب أولوية الظهور. 
تحديد بدء الاستماع لملف الصوت بالضغط مع السحب للصوت في مساره بالشريط الزمني وتحديد 


موضعه. 


۵۱ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


حفظ مشروع الفيديو Save Project‏ 


تلك الملفات داخل مجلد محددء وفي الدروس السابقة تم حفظ جميع تلك الملفات داخل مجلد باسم "7701" 
وذلك حتى يمكن الرجوع لمشاهد الفيديو والتعديل بها بالحذف أو بالإضافة أو لاستكمال العمل في الفيديو في 


وقت آخرء والآن كيف يمكن حفظ مشروع الفيديو؟ 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بحفظ مشروع "870661 الفيديو. 
ات تنفيذ النشاط 
يتم حفظ مشروع الفيديو من خلال التالي: 
- حفظ جميع الملفات (صور. صوت....) والمستخدمة في مشاهد الفيديو» داخل مجلد محدد. 


- من شريط القوائم الرئيس 1001931 31الل يتم اختيار ھ‌Fil‏ ثم اختيار .Save Project As‏ 


- تسمية المشروع بأسم "561" ( يجب أن يكون الأسماء المستخدمة باللغة الإنجليزية). 


- تحديد مكان الحفظ داخل مجلد "701". 

- إغلاق برنامج إنشاء ومعالجة الفيديو. 

- ولاستكمال العمل في مشروع الفيديو مرة أخرى» يتم تحميل برنامج إنشاء ومعالجة الفيديوء ثم فتح 
المشروع "561" من داخل المجلد "2001". 


- التعديل في مشاهد مشروع الفيديو. 


الكهبيوتر وتكذولوجيا المعلوهات والإتصالات 6٠‏ 


وزارة القربية والتعليم 


ملاحظات هامة لحفظ المشروع 


أثناء العمل على برنامج 08615104 من خلال نظام التشغيل 17001/5آلالا وحفظ المشروع السابق قد 


نلاحظ أن رمز الملف المحفوظ "561" قد يكون غير مُعرف ويظهر رمزه بالشكل التالي 
ولریط الملف ببرنامج "07615101" يتم عمل اقتران "85506131101 وذلك بإتباع 
الخطوات التالية: 

- الضغط بالزر الأيمن على رمز الملف "561" تظهر قائمة فرعية. 

.More Options ثم‎ Change ثم‎ Properties من هذه القائمة يتم اختيار‎ - 
.Look for another app on this PC اختيار‎ - 

- البحث عبر جهاز الكمبيوتر على المجلد الذي تم تثبيت برنامج 061751014 به. 


-اختيار اقتران الملف "855061314101 بالملف التنفيذي للبرنامج. 


Î presets 
JÎ profiles 
JÎ PyOt5.uic.widget-plugins 


i Local Disk (ع)‎ 
وت‎ Local Disk )0:( 
وت‎ Local Disk (E) ب‎ 


of‏ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


بعد معاينة مشاهد الفيديو قد تحتاج تلك المشاهد إلى التعديل مثل إعادة ترتيب المشاهدء حذف أحد 
المشاهد, زيادة الفترة الزمنية أو تقليل الفترة الزمنية لإحداها أو أن الفترة الزمنية التي يعرض بها الصوت 
أكبر من الفترة الزمنية لمشاهد الصور. 
١-التحكم‏ في الفترة الزمنية المخصصة لعرض مشهد فيديو (مذا© 060آلا): 


بعد عمل معاينة لمشاهد الفيديو (الصور مع الصوت) فقد يكون الصوت بالفيديو فترته الزمنية للعرض 
أكبر من الفترة الزمنية لكليب الصور ويظهر ذلك في الشريط الزمني 71061176 حيث ينتهي عرض الصور 
ويستمر الصوت مسموع وذلك في معاينة الفيديو كما يمكن ملاحظة ذلك في مشاهد الفيديو (5م1ذا©) 
بالشريط الزمني. 
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وزارة التربية والتعليم 
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Track 4 Practice Test 1.mp3 


ل ل 


Track 2 


الفترة الزمنية لعرض 
كليبات الصور ف 


- ويمكن التحكم في مشهد الصوت بحيث ينتهي مع نهاية عرض آخر مشهد لآخر صورة على الشريط 
0 
Project Files Transitions ES‏ 
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' الشريط الزمنى 1192761156 " 


00 الصف الثاني الإعدادي 


وزارة التريية والتعليم 


التحكم في الفترة الزمنية المخصصة للصوت مع مشاهد الصور 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بالتحكم في مشهد الصوت من خلال تحديد 
الفترة الزمنية له على الشريط الزمني. 
خطوات تنفيذ النشاط كالآتى: 
- تحريك مؤشر القراءة وذلك بالضغط والسحب على رأسه (أو باستخدام الأسهم بلوحة المفاتيح) حتى يصل 
لآخر مكان على الشريط الزمني ينتهي عنده ظهور آخر صورة في مشهد الفيديو. 
Project Files Transitions Effects‏ 
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00:00:30:01 


Track 4 Practice Test 1.mp3 


ل ل 


27 
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- الوقوف بمؤشر الفأرة على مسار الصوت (19361) والضغط بالزر الأيمن للفأرة. 
- ومن القائمة المختصرة التي تظهر يتم اختيار شريحة الكليب صCli Slice‏ -ثم .Keep left slide‏ 


- يقوم الطلاب بتدوين ملاحظاتهم لنتائج هذا الاختيار. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات 0٦‏ 


وزارة التربية والتعليم 


Project Files Iransitions 
Separate Audio 
Keep Both Sides 
Display Keep Left Side 
3 Properties Keep Right Side 
Track 4 Practice Test 1.mp3 Remove Clip 


Jd 


00:00:3001 


ا 
- عند تحريك مؤشر القراء ة على الشريط الزمني ثم اختيار أحد المسارات بالوقوف والتأشير عليه بالفأرة 
واختيار أمر "0110© ©5116" (شريحة الفيديو) فإنه يتم عمل انقسام في مشهد الفيديو بالمسار المحدد وذلك 


في موضع مؤشر القراء ة ليصبح شريحتين (شريحة جهة اليمين و شريحة جهة اليسار). 


عزيزى الطالب : عند اختيار أمر شريحة الكليب ما٣‏ 51166 تظهر الاختيارات التالية: 


Keep Both slides - 
Keep left slide - 
Keep Right slide - 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك استنتج الفرق بين هذه الإختيارات. 


- عند اختيار 511065 58041 660! يتم عمل انقسام في الكليب الذي على المسار إلى شريحتين مع 
الاحتفاظ بهما. 


Project Files Transitions Effects 


® 9“ 7 © 20 seconds 


00:00:20 


Track 4 Practice Test 1.mp3 Practice Test 1.mp3 
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لاه الصف الثاني الإعدادي 


وزارة التربية والتعليم 


- عند اختيار ©5110 ١۴٠ا‏ 667©! يتم عمل انقسام في الكليب الذي بالمسار إلى شريحتين مع إبقاء 


Project Files Transitions Effects 
© 20 seconds 


00:00:29:20 


Track 4 Practice Test 1.mp3 
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- عند اختيار ٠اه‏ 11914 م٠٠‏ يتم عمل انقسام في الكليب الذي على المسار إلى شريحتين مع إبقاء 
الشريحة التي باليمين فقط ومسح الشريحة باليسار. 


Project Files Transitions 
© 20 seconds 


00:00:29:11 


- من خلال تحديد الفترة الزمنية للمشهد على الشريط الزمني. 

- بالضغط والسحب على رأس مؤشر القراءة وتحريكه حتى يصل للمكان المطلوب على 
الشريط الزمني. 

- الضغط على مسار المشهد 75361 بالزر الأيمن للفأرة» تظهر قائمة مختصرة. 

- اختيار أمر شريحة الكليب 110 © ©5116 - لينقسم المشهد لشريحتين وعند اختيار: 

Both 511065 -‏ مKee‏ يتم الإبقاء على الشريحتين (اليسرى واليمنى). 

Keep 1656 51106 -‏ يتم الإبقاء فقط على الشريحة اليسرى. 

- 51106 4و1 Keep‏ يتم الإبقاء فقط على الشريحة اليمنى. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات مه 


وزارة القربيبة والتعليم 


إضافة تأثيرات "۴۴۴٥٤٤٤"‏ لمشهد الفيديو 


يتم إضافة تأثيرات "2566615" على مشهد (أو مشاهد) الفيديو والتحكم في الفترة الزمنية لهذا التأثير 
وذلك على حسب الرغبة في إظهار هذا المشهد (أو المشاهد). 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بإضافة تأثير لمشهد الفيديو. 


ت تنفيذ النشاط كالتا 


- الضغط على تبويب "5766615 " للانتقال إلى التأثيرات. 
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Project Files Transitions Effects 


- تظهر مجموعة من التأثيرات تحت تحت اسم Effects"‏ ". 


0۹ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


Show All Video Audio 
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Blur Brightness ... Chroma Ke... 
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Deinterlace Alpha Mask / ... Negative 


ال جك 


Colour Saturation 


Project Files Transitions Effects 
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Track 4 897.jpg st 1.mp3 


- لإضافة تأثير ”٤ ۴٠٥٤‏ لمشهد الفيديو يتم اختيار أحد التأثيرات. 


- الضغط والسحب على التأثير واضافته لمشهد الفيديو. 


ile Edit Title View Help 
PRED ©» م‎ 
Ffects Video Preview 


Show All Video Audio 


7 LE > 
Blur Brightness ... Chroma Ke... 
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Alpha Mask / ... 


Colour Saturation 


Project Files Transitions Effects 


® - © 11 seconds 


00:00:02:08 


Track 4 


- عمل معاينة لمشاهدة الفيديو. 


- يدون الطلاب ملاحظاتهم بعد وضع التأثير على مشهد الفيديو. 


الكعبيوتر وتكنولوجيا المعلومات والاتصالات 


و" 


وزارة القربية والتعليم 


)22)22 2200-1 


Track 4 


OO0:00:00:11 


| Track 4 5 Negate 4 


- ولحذف التأثير المضاف للمشهد الفيديو بالضغط على زر الفأرة الأيمن على رمز التأثيرء لتظهر القائمة 
المختصرة لحذف التأثير "115661 56100176" واختيار حذف التأثير. 


00:00:00:11 


| Track 4 IM £47 ina 
Remove Effect 


إضافة تأثير لمشهد الفيديو: 
- الضغط على تبويب 'sاcم؟ع‏ ". 
- اختيار أحد التأثيرات بالضغط والسحب عليه وإضافته لمشهد الفيديو. 
- يظهر رمز التأثير على مشهد الفيديو. 
- ولقراءة اسم التأثير يتم التأشير بالفأرة على رمز التأثير. 
- ولحذف التأثير المضاف لمشهد الفيديو بالضغط على زر الفأرة الأيمن على رمز التأثير 
واختيار حذف التأثير ."Remove Effect"‏ 


ْ "١ ْ 


5 الصف الثاني الإعدادي 


وزارة التربية والتعليم 


ثانياً: إضافة مراحل انتقالية 7:31051110115 لمشاهد الغيديو 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بإضافة مرحلة انتقالية 72205161005 


خطوات تنفيذ النشاط كالتالى: 
- الضغط على تبوبب الانتقالات "113051110115" 


1 Video Preview 


- فتظهر مجموعة من المراحل الانتقالية. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات 


13.gif DSC_0600... 
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Project Files Transitions Effects 
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وزارة القربية والتعليم 


File Edit Title 
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Video Preview 
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- يتم وضع المرحلة الانتقالية في بداية أو نهاية المشهد. 

- التحكم في فترة الزمنية لعرض المرحلة الانتقالية بالضغط والسحب عليها لتقليل أو زيادة الفترة الزمنية لها 
بالعرض . 

- عمل معاينة لمشاهدة الفيديو. 


3 الصف الثاني الإعدادي 


وزارة التريية والتعليم 


| تدریب | 1 
Bn)‏ عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بالتنقل بين التبويبات الثلاثة 


الآثية: "Effects"‏ و "Transition"‏ و «Project Files"‏ مع التأكيد على الفرق فى استخدامها. 


File Edit Title View Help 
BR 2 ww جم‎ 


Transitions Video Preview 


Show All Common 


O 
I يد بح يرجم(‎ E ع‎ 


TE بحسي‎ J 0 2 


Project Files Transitions Effects 


انتقالية_ Transitions‏ 
- الضغط على تبويب الانتقالات sition"‏ ۾٣''.‏ 
- الضغط مع السحب على أحد المراحل الانتقالية وإضافته للمشهد المطلوب. 
- وضع المرحلة الانتقالية في بداية أو نهاية المشهد. 
- التحكم في فترة الزمنية لعرض المرحلة الانتقالية بالضغط والسحب عليها لتقليل أو زيادة 


الفترة الزمنية لها بالعرض. | 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات 54 


وزارة التربية والتعليم 


ثالثاً: إضافة نص إلى الغيديو 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بإضافة نص لمشاهد الفيديو. 


ت تنفيذ النشاط كالاد 


- تحديد النصوص المطلوب إضافتها للفيديو. 

- تحديد الأماكن التي سوف يضاف إليها النص (في بداية الفيديو - بين مشاهد الفيديو - في نهاية 
الفيديو). 

- من قائمة 11618 يتم اختيار ©11]41., فيظهر المريع الحواري التالي: 

١-اختيار‏ قالب الخط ”عmp|a “Select a te‏ 82 موده 


۲-تغيير نوع الخط “Change Font”‏ 


Font: Change Font 


۳-تغییر لون الخط "0101) ]ا 1" Bt els‏ ا 


Background: Background Colour 


Advanced: Use Advanced Editor 


؛-تغيير لون الخلفية "0101© "Background‏ 
ه-حفظ النص في ملف "52106" 


Save Cancel 


Template: Gold 1 ve 


مدرسة السنية الإعدادية :1 Line‏ 
ليتات 


مدرسة الستية الإعدادية للبنات 


Font: Change Font 
Text: د‎ Text Color 


Advanced: Use Advanced Editor 


Save Cancel 


1 الصف الثاني الإعدادي 


وزارة التربية والتعليم 


- بمساعدة معلمك وبمشاركة زملائك تعرف على الخطوات المختلفة لكيفية ملء المريع الحواري 
لإضافة نص. 

- بالضغط على زر حفظ "53176" لحفظ النص داخل ملف في مجلد مشروع "7701". 

- يجب تسمية الملف النصي باللغة الإنجليزية. 

- يظهر الملف النصي في ملفات المشروع "1!©5! 4ع2:/0[6. 


مدرسة الستية الإاعدادية تليتات 


- ولإضافة النص إلى مشاهد الفيديو بالضغط مع السحب على الملف النصي بملفات مشروع وإضافته إلى 


أحد المسارات. 


لإضافة نص لمشاهد الفيديو : 
- من قائمة 7106 يتم اختيار ©5161. 
- ملء بيانات المريع الحواري. 
- حفظ النص في ملف "53176". 
- تسمية ملف النص باللغة الإنجليزية. 
- يظهر الملف النصي في ملفات المشروع "5٥ا۴‏ أعوزه270". 
- إضافة الملف النصي إلى مشاهد الفيديو بالضغط مع السحب على ملف النص وإضافته 
إلى أحد المسارات. ٠ش‏ 


١ ' 


الكعبيوتر وتكنولوجيا المعلومات والاتصالات ۹٦‏ 


وزارة التربية والتعليم 
ملاحظات: 
- يمكن وضع النص في بداية الفيديو أو بين مشاهد الفيديو المختلفة أو في نهاية الفيديو. 
- إضافة مسار "77361" أو أكثر لوضع النص عليه والمشاهد الأخرى (صور-أصوات). 
- إعادة ترتيب مشاهد الفيديو (الصور-الصوت-النص) على المسارات وذلك على حسب أولوية الظهور. 


© 20 seconds 


00:00:01 


Track 6 


إإعادة ترتيب مشاهد الفيديو ' 


ندريب 
عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بإضافة نص آخر للفيديو 
من خلال اتباع الآتى: 
- اتباع نفس الخطوات السابقة لإنشاء ملف نصي آخر يحتوي على بيانات عن مدرستهم مثل اسم 
المحافظة والإدارة التعليمية. 


- حفظ ملف النص داخل مجلد مشروع "8801". هدرسة السنية الأعانية يلت 
- إضافة النص لمشاهد الفيديو كما بالخطوات السابقة. 


محافظة: القاهرة 


ج إعادة ترنيب مشاهد الفيديو ا 


1۷ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


تصدير الفيديو إلى ملف بامتداد مناسب 


بعد الانتهاء من المشروع ووضع جميع مشاهد الفيديو المطلوبة والتعديل بها ووضع التأثيرات 
المطلوبة والمراحل الانتقالية عليها يمكن تصدير المشروع إلى ملف فيديو ذو امتداد يناسب الاحتياجات 
المطلويةء ومن خلال هذا البرنامج يمكن تصدير ملف الفيديو للعديد من الامتدادات. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بتصدير الفيديو إلى ملف بامتداد مناسب. 


ت تنفيذ النشاط كالتا 


- الضغط على زر تصدير الفيديو ® ”1060لا 014م2ا“ فى القائمة الرئيسة "Main Toolbar"‏ 


(أو من خلال قائمة File‏ ثم اختيار .(Export Video‏ 


ل فسا ما 


Project Files 


Show All Video Audio Image 


مدرسة الستية الإإعدادية اللبنات 


- يظهر المربع الحواري لتصدير الفيديو "1060لا 0114م<اا". 
- تحديد اسم لحفظ ملف الفيديو "81300 ©11لا". 
- تحديد مكان حفظ الملف على جهاز الكمبيوتر أو أحد وحدات التخزين "5345 201061". 


- تحديد نوع امتداد ملف الفيديو "1310©1". 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۸ 


وزارة التربية وانتعليم 


- تحديد مستوى جودة الملف (عالي الجودة - متوسط الجودة-قليل الجودة) 'راااQua'.‏ 
- الضغط على زر تصدير الفيديو "1/1060 880014" ليبدأ في تصدير ملف الفيديو. 


- تشغيل ملف الفيديو الذي تم تصديره ومشاهدته. 


File Name: Untitled Project 


Folder Path: C\Users\AHAMED.204 


Simple Advanced 


Select a Profile to start: 


Profile: All Formats 


Select from the following options: "Export 1/1060 "المريع الحواري تته دير الفيديو‎ 


Target: MP4 (h.264) 
Video Profile: HDV 720 24p 


Quality: High 


Export Video Cancel 


Projectî 
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514 الصف الثاني الإعدادي 


وزارة التربية والتعليم 


لتصدير ملف الفيديو بامتداد مناسب: 
- الضغط على زر تصدير الفيديو ”1060لا 011ماط" . 
في المربع الحواري لتصدير الفيديو "19060/ا 2014" تحديد التالي: 
- اسم ملف الفيديو N2۳۴۲"‏ eاا۴'.‏ 
- مكان حفظ الملف ."Folder Path'‏ 
- نوع امتداد ملف الفيديو "130©1". 
- تحديد مستوى جودة الملف 'راااQua".‏ 


- تصدير الفيديو بالضغط على زر تصدير الفيديو "0ع106ل/ا 014م)<ا". 


أنواع ملغات الفيديو ذات الامتدادات المختلفة 


هناك أنواع مختلفة لملفات الفيديو ذات الامتدادات المختلفة» وتختلف من حيث المساحة التخزينية 


والجودة والنقاء » ويتم تحديد نوع امتداد ملف الفيديو على حسب الاستخدام. 


ندريب 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بالبحث عبر الإنترنت عن التالي: 


- أنواع ملفات الفيديو المختلفة» واستخداماتها المختلفة. 
- الفرق بين ملفات الفيديو ذات الامتداد ( 1/54 -ا۸۷ -...) من حيث المساحة التخزينية» جودة 


ووضوح الفيديو. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۷۰ 


وزارة التربية والتعليم 


ان 


لإنشاء الفيديو يتم اتباع التالي: 
- استيراد ملفات الصور والصوت داخل البرنامج. 
- ترتيب مشاهد الفيديو (صور- صوت) على الشريط الزمني 11061106 للبرنامج. 


حفظ مشروع الفيديو 14عء[2170 5216: 
- إنشاء مجلد للمشروع (وإعطاء اسم له باللغة الإنجليزية) على أحد وحدات التخزين. 
- وضع جميع الملفات (صور- صوت...) المستخدمة لإنشاء الفيديو داخل مجلد المشروع. 
- حفظ ملف المشروع ( وإعطاء اسم له باللغة الإنجليزية) من شريط القوائم الرئيس “ai”‏ 
21 » يتم اختيار File‏ ثم .Save Project As‏ 
- حفظ ملف المشروع داخل مجلد المشروع. 
تعديل مشاهد الفيديو من خلال: 
- التحكم في الفترة الزمنية المخصصة لعرض مشهد فيديو (ما٣‏ 060 ثلا). 
- إضافة تأثيرات "21615" لمشهد الفيديو. 
- إضافة مراحل انتقالية 113051110075 بين مشاهد الفيديى. 
لإضافة نص لمشاهد الفيديو: 
- من قائمة 1141 يتم اختيار ©71:18. ملء بيانات المربع الحواري. 
- حفظ النص في ملف ( تسمية ملف النص باللغة الإنجليزية). 
- يظهر الملف النصي في ملفات المشروع "11165 4©هزه:50, ويتم إضافة الملف النصي إلى 
مشاهد الفيديو بالضغط مع السحب على ملف النص وإضافته إلى أحد المسارات. 


تصدير الفيديو إلى ملف بامتداد مناسب: 


- هناك أنواع لملفات الفيديو ذات امتدادات مختلفة (مثل ۸۷1-۸۴4 -..). 


۷1 الصف الثاني الإعدادي 


تتكون واجهة البرنامج من التالي: 


File Edit Title View Help 
REDD QQ” + ا لا‎ 


Project Files HA Video Preview 


ShowAll Video Audio Image [Filter 
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وزارة القربية والتعليم 


السؤال الثالث:_رتبت الخطوات التالية لحفظ مشروع الفيديو 64 6زه570 523176: 


) حفظ ملف المشروع داخل مجلد المشروع. 
) حفظ ملف المشروع ( وإعطاء اسم له باللغة الإنجليزية) من شريط القوائم الرئيس ”اة“ 


.Save Project As ثم‎ File يتم اختيار‎ robar 


7 الصف الثاني الإعدادي 


وزارة التربية والتعليم 


السؤال الرايع: أكمل الشريط الزمني 110061106 للبرنامج يتكون من: 


)22 5 


Track 4 
2015-6356... 


Track 2 


يتم الإجابة على الأسئلة من خلال: 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات V4‏ 


Vo 


الصف الثاني الإعدادي 


وزارة التربية والتعليم 


وزارة التربية والتعليم 


الوحدة الثانية 


إنشاء صفحات ويب 


HTML باستخدام‎ 


بعد الإنتهاء من هذه الوحدة يتوقع أن يكون الطالب قادرا على 


« يناقش تأثير استخدام خدات تقنيات المعلومات الحديثة على المجالات الدراسية والحياتية المختلفة 
٠‏ يتعرف بعض أدوات إنتاج صفحات المعلومات وخدمات الانترنت. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۷ 


وزارة القربية والتعليمع 


الموضوع الأول 


لغة الترميز ل1۲۷1 


(Hyper Text Markup Language) 


يتعرف بعض ادوات انتاج صفحات المعلومات وخدمات الإنترنت. 

يتعرف القواعد الأساسية لإنشاء صفحة ويب باستخدام أوامر ا۸ 1۲. 
يتعرف التركيب البنائي لإنشاء صفحة ويب بأوامر -111/1ا. 

يضيف محتوى لصفحة الويب (نص-صورة - فيديو -ارتباطات تشعبية-...). 
ينسق محتوى صفحة الويب. 

يدرج ارتباط تشعبي داخل صفحة الويب / بين صفحات الموقع. 


3 الصف الثاني الإعدادي 


وزارة التربية والتهليم 


في الفصول السابقة تعرفنا على المراحل الأساسية لإنشاء موقع ويب» ومن هذه المراحل مرحلة التنفيذ 
والتي يتم فيها تحويل التصميم الورقي لصفحات الموقع إلى صفحات ويب يُوضع فيها البيانات المختلفة 
(نصوص - صور- صوت -فيديو) وذلك حسب مرحلة التصميم السابقة لكل صفحة ويب» وإنشاء الارتباطات 
ل 


وفي هذا الفصل سوف نتعرض بالتفصيل إلى كبا كيفية استخدام أوامر HTML‏ في إنشاء أحد صفحات 
الويب ثم يلي ذلك عرض تفصيلي لكيفية إنشاء موقع 'مدرستي" والذي تم وضع تصميم تفصيلي لصفحاته. 


مدرستي 


الصفحة الرئيسة عن المدرسة ألبوم الصور الرؤية والرسالة 


فن المدرسة 1 الرؤية والرسالة 
تاريخ نشأة المدرسة: .. > 2 
عنوان المدرسة: .... . تليفون المدرسة: ... في 7 | : ا 5 رؤية المدرسة: 

4 7 ا N.‏ إعداد طالب متميز قادر على .... 
الرسالة: 


تنمية مهارات الاب 5 


.ام لبط 0 5 1 3 اث 'موقع مدرستى" 


لغة الترميز ا۷ 1۲: 


هي لغة تكويد تستخدم لإنشاء صفحات موقع الإنترنت الثابتة والتي يتم عرضها باستخدام أحد برامج 
مستعرضات الإنترنت. 


أوامر لغة :HTML‏ 


العهبيوتر وتكنولوجيا المعلوعات والاتعالات ۷۸ 


وزارة القربية والتعليمع 


لإنشاء صفحة وبب يتم استخدام أوامر لغة االاا11!ا. وتسمى هذه الأوامر بال 1305 ويقوم برنامج 


مستعرض الإنترنت بتنفيذها ليظهر تأثير تلك الأوامر على صفحة المستعرض. 


- إنشاء ملف نصي باستخدام أحد برامج تحرير النصوص وذلك لكتابة أوامر ا1۲۷ وتعديلها. 

- كتابة أوامر ا1۲۷ حيث يتم وضع الامر بين العلامتين ' < >". 

- معظم الأوامر لها بداية ' < > ' ونهاية ' < |> ' . 

- حفظ الملف النصي الذي يحتوي على أوامر ا1۲۷ بامتداد 8]00. أى اہ٤ط.‏ 

- فتح الملف المحفوظ باستخدام مستعرض الانترنت لعرض صفحة الويب ومشاهدة نتيجة 
تنفيذها. 


- لا يشترط أن تكتب أوامر 171011! بحروف كبيرة اهمه أو صغيرة !/5002. 


۷۹ الصف الثاني الإعدادي 


التركيب البنائي لإنشاء صفحة الويب باستخدام 41101 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك تعرف على التركيب البنائي لإنشاء صفحة 
ويب باستخدام أوامر ا۷ 1۲. 


خطوات تنفيذ النشاط 


- تحميل أحد برامج تحرير النصوص. 
- يكتب الأمر <401> في بداية الكود ليشير الى أن المستند مكتوب بلغة 01غط. 
يقسم كود ١111/1‏ لقسمين رئيسين هما: 


6201 : وهي المنطقة الخاصة بكتابة معلومات للمتصفح حول الصفحة مثل عنوان الصفحة. 


01 !: وهي المنطقة الخاصة بكتابة المحتوى الذي سيظهر داخل الصفحة. 
وبالتالي يكون التركيب الأساسي لملف الأوامر كما يلي: 
كتابة التركيب البنائي لإنشاء صفحة وبب 


التركيب البنائي لإنشاء صفحة ويب باستخدام 111/11] باستخدام ا1۳۷ في محرر النصوص 


<html> 
<head> 


</head> 
<body> 


</body> 
</html> 


وزارة التربية والتعليم 


تتكون صفحة الويب من عنوان ومحتوى» ويظهر عنوان صفحة الويب داخل شريط العنوان أعلى 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بالبحث عبر الإنترنت ومشاهدة عنوان ومحتوى 


أحد صفحات الوبب. 3 
عنوان صفحه الويب 


× وزارة التربية والتعليم 


X Û www.moe.gov.eg 


وزارة التربية والتعليم 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بإضافة كلمة 'مدرستي" كعنوان لصفحة 
الويب. 


خطوات تنفيذ النشاط: 
- تحميل أحد برامج تحرير النصوص. 
- كتابة التركيب البنائي لإنشاء صفحة وبيب بأوامر 111/1!. 


- كتابة أمر <41618/> مدرستى <4118> في الجزء المخصص < 5620...>/56230> . 


<html> 
<head> 


F titles gaw </title> || 
</head> 
% SS <body> 


Î Hmmm 


</body> 
</html> 


كتابة الكود في محرر النصوص فتح الملف ١٠۸.١مه۸ءء‏ (صفحة الويب) 
- حفظ الملف باسم 561001.5400. بمستعرض الإنترنت 
- فتح الملف 561001.547 (صفحة الويب) من خلال مستعرض الإنترنت لمشاهدة نتيجة تنفيذ الأوامر 


التي تم كتابتها. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۸۲ 


وزارة التربية والتعليم 


يمكن أن تحتوي صفحة الويب علي (نص-صورة - فيديو -ارتباط تشعبي-...) 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بإضافة نص 'مدرستى جميلة ونظيفة 
ومتطورة" لمحتوى صفحة الوبب. 


خطوات تنفيذ النشاط: 


في الملف النصي السابق تكتب العبارة 'مدرستي جميلة ونظيفة ومتطورة" داخل أمر </body>‏ .. 
.<body>‏ 


- حفظ الملف النصي بنفس الاسم " 561001.51407 '. 


- فتح الملف ' 561001.1407 ' من خلال مستعرض الإنترنت لمشاهدة نتيجة تنفيذ الأوامر. 


<html> 

<head> 

<116غ/> مدرستي <1+16+» 
</head>‏ 

<body> 

مدرستي جميلة ونظيفة ومتطورة 


</body> 
</html> 


وزارة التربية والتعليم 


رسب ) عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بالتعديلات الآتية فى 
التدريب السابق: 
- إعادة كتابة أوامر 1111/1 باستخدام حروف كبيرة 44615© ! .Capia|‏ 
- ترك مسافات بين كلمات النص. 
- استخدام مفتاح الادخال لترك أسطر بين كلمات النص. 
- حفظ الملف النصي بامتداد 11617. 


- استعراض الملف من خلال مستعرض الإنترنت. 


عند تصميم صفحة ويب ذات واجهة عربية يجب تغيير اتجاه الصفحة ليصبح اتجاه محتوى الصفحة 


من اليمين إلى اليسار ليتلاءم مع طبيعة اللغة العربيةء ولتنفيذ ذلك تُستخدم الخاصية ٣ء‏ حيث يتحدد اتجاه 


صفحة الوبب حسب القيمة المخصصة للخاصية |٣‏ كما بالجدول التالي: 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات 5م 


وزارة القربية والتعليم 


قيمة الخاصية ظ تأثيرها 


rtl‏ اتجاه صفحة الويب من اليمين الى اليسار 


Itr‏ اتجاه صفحة الويب من اليسار الى اليمين 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بتغيير اتجاه محتوى صفحة الويب من 
اليمين إلى اليسار فى التدريب السابق. 


خطوات تنفيذ النشاط: 
- التعديل في الكود بإضافة الخاصية ال للأمر <رلهط> ... <رلهط/> 


- تخصيص القيمة !1 للخاصية ١اك‏ لتصبح صورة الأمر <رلهط> هي<!"-16أل لال600>. 
- حفظ تعديل الملف النصي. 


- فتح ملف صفحة الوبب من خلال مستعرض الإنترنت لمشاهدة نتيجة تنفيذ الخاصية 0117. 


<html> 

<head> 

»>+1416( مدرستي‎ 111 
| </head> 


<body dir="rt1"> 
رط جلف شرا‎ 


اتجاه محتوى الصفحة من اليمين لليسار 


كتابة الكود في أحد برامج تحرير النصوص 


۸0 الصف الثاني الإعدادي 


وزارة التربية والتهليم 


2_| عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بعمل مقارنة بين تأثير 
القيمة "٣٤"‏ والقيمة "161" للخاصية i١‏ على اتجاه محتوى صفحة الويب. 


<body dir="ltr'> 


اتجاه محتوى الصفحة من اليمين لليسار MR MT TOT ٠‏ 


(مقارنة توضح تأثير قيم الخاصية ١iك)‏ 


توجد العديد من التنسيقات التي يمكن تطبيقها على محتوى صفحة الويب حتى تبدو أكثر جاذبيةء 
ويوجد من التنسيقات ما يطبق على النص بصفحة الويب وما يطبق على خلفية صفحة الويب. 


٠‏ تنسيق النص يتضمن العديد من العمليات سوف نتناول منها: 

© الكتابة بداية من سطر جديد. 

ه محاذاة النص. 

ه وضع فراغات بين الكلمات. 

ه تنسيق الخط من حيث (النوع - الحجم - اللون - النمط). 
ه تنسيق الصفحة يتضمن: 

ه تغيير لون خلفية صفحة الويب. 

0 وضع صورة كخلفية لصفحة الويب. 


وزارة التربية والتعليم 


اولا: تنسيق النص بصفحة الوبب: 


لكي يظهر النص داخل صفحة الويب في سطرين يتم استخدام الأمر <501>., حيث يستخدم هذا الأمر للكتابة 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بتنفيذ الآتي: 
- تشغيل برنامج محرر النصوص. 
- كتابة كود ا1۲۷ الموضح بالشكل. 
- حفظ الملف النصي بامتداد 5400. 


- فتح الملف في مستعرض الإنترنت. 
<html>‏ 


قيس مسا لاه سل < >/t 1t1‏ مدرستي <1+16+» 


</head> 
<body dir="rt1"> 
المدرسة: الشروق الإعدادية‎ 


الاسم : محمد خالد ‏ 
</body>‏ 
صفحة الويب بالمستعرض بعد تنفيذ الكود </html>‏ 


لاحظ ظهور المحتوى النصي على | 
سطرين نتيجة لإستخدام الأمر <]ط> كتابة الكود في أحد برامج تحرير النصوص 


وزارة التربية والتعليم 


لوضع نص في منتصف السطر يستخدم الأمر <061161>. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بتنفيذ الآتي: 
- فتح الملف النصي السابق. 
- إضافة الأمر <115617©©> موقع المدرسة <إع†cen‏ / >. 
- حفظ تعديل الملف النصي. 
- فتح الملف من خلال مستعرض الإنترنت. 
<html>‏ 
<head>‏ 
(4116/»> مدرستي (1+16+» 
</head>‏ 
<body dir="rt1">‏ 
</center> |‏ موقع |لمدرwة <center>‏ _ 
المدرسة: الشروق الإعدادية 
<br> e‏ 
الاسم : محمد خالد 
</body>‏ 
لاحظ ظهور العبارة 'موقع </html>‏ 
المدرسة" في منتصف السطر. 


صفحة الوبب بعد تنفيذ الكود 


كتابة الكود في أحد برامج تحرير النصوص 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات I۸‏ 


وزارة التربية والتعليم 


٣-إضافة‏ فراغات بين الكلمات بالأمر ;pئطہ&‏ 


عند ترك أي عدد من المسافات بين الكلمات داخل ملف الأوامر سوف يتعامل معها مستعرض الإنترنت 
عند عرض الصفحة على أنها مسافة واحدةء وللتحكم في عدد المسافات (الفراغات) بين الكلمات نستخدم 
الرمز :م815., حيث يتم تكراره بعدد الفراغات المطلوبة بين الكلمات. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بتنفيذ الآتي: 


- فتح الملف النصي السابق. 
- كتابة الكود 'موقع :م8025 &nbsp; &nbsp;‏ 


<html> 
<head> 
>81]19< ;مك المدرسة". <41616/> مدرستي‎ 
</head> .1117 حفظ الملف النصي بامتداد‎ - 
<body dir='rtl'> فتح الملف في مستعرض الإنترنت.‎ - 
<center> 
<|center> 
المدرسة: الشروق الإعدادية‎ 
<br> درف‎ 
اريع قراغات‎ 
الاسم: محمد خالد‎ 
</body> صفحة الويب بعد تنفيذ الكود‎ 


</html> 
لاحظ ظهور العبارة 'موقع المدرسه"‎ 


مع وضع ؛ مسافات بين الكلمتين. كتابة الكود في أحد برامج تحرير النصوص 


۸۹ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


٤-أ-‏ تنسيق الخط في صفحة الويب بالأمر <font> ... </font>‏ 


للتحكم في نوع وحجم ولون الخط يتم استخدام الأمر <أ١ه؟>‏ وهو أمر له مجموعة من الخصائص منها: 


يتعرف المستعرض على ۷ أحجام مختلفة من الخطوط والتي يتم تحديدها بواسطة الخاصية 5126 حيث 
تتراوح قيمة هذه الخاصية من ١‏ الى ۷. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بإنشاء صفحة ويب ذات اتجاه 
يمين ويها النص 'مدرستي جميلة ونظيفة ومتطورة " بخط نوعه اندلسي "300305 " بلون أحمر 
وحجم الخط ". 

خطوات تنفيذ النشاط 

- كتابة الكود. 

- حفظ الملف النصي بامتداد 5405. 


- فتح الملف في مستعرض الإنترنت. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۹۰ 


وزارة التربية والتعليم 


مدرستي جميلة ونظيفة وحتطورة 


<html> 
<head> 
</head> 


<body dir="rt1"> 

<font face="andalus" color="red" size="6"> 
مدرستي جميلة ونظيفة ومتطورة‎ 

</html> 


كتابة الكود في أحد برامج تحرير النصوص 


- بعد استخدام أمر الاغلاق <5006/> ينتهي تأثير الأمر على تنسيقات أي نص يكتب بعده. 
- في حالة عدم استخدام الأمر <٤١ه>‏ يظهر نوع الخط على صفحة الويب بالشكل الافتراضي. 


۹۱ 


الصف الثاني الإعدادي 


وزارة التربية والتعليم 


-ب- تنسيق الخط في صفحة الويب 


يوجد العديد من الأوامر التي من خلالها يتم تنسيق الخط ومنها الأوامر الموضحة بالجدول التالي: 


الوظفة 


2 


وضع خط تحت النص (مسطر )(Underliıe‏ 


)850101( خط عريض‎ <b> 
)!٤ھااء( خط مائل‎ <i> 


عزيزى الطالب: بالتعاون مع زملائك وبمساعد فى الملف السابق قم بوضع خط أسفل العبارة 


'مدرستي جميلة ونظيفة ومتطور" 

(html) 
(head) ت تنفيذ النشاط‎ 
(/head) إضافة الكود:‎ - 

<0ا/> مدرستي جميلة ونظيفة ومتطور >u<‏ 
- حفظ التعديل الملف النصي. (body dir="rt1")‏ 
(font face="andalus" colle" red" size="6")‏ 
۲ مدرستي جميلة ونظيلة ومنطورة (را» 


مدرستي جميلة ونظيفة وحتطورة ٠‏ لاسا 


21١ 


صفحة الويب بعد تنفيذ الكود كتابة الكود في أحد برامج تحرير النصوص 


الكمبيوتر وتكنولوجيا الععلوعاة والاتعالات ۹۲ 


وزارة القربية والتعليم 


E5 


أعزيزق الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بالتعديل في ملف صفحة الويب 
السابق كالآنى: 


- تنسيق الخط في صفحة الويب لجعله مائل للعبارة "مدرستي جميلة ونظيفة ومتطورة ". 
- تنسيق الخط في صفحة الويب لجعله خط عريض للعبارة ' مدرستي جميلة ونظيفة ومتطورة ". 


نلاحظ أن لتنسيق الخط في صفحة الويب: 

- جعله مائل "مدرستي جميلة ونظدفة ومتطورة ". 

يكتب الكود: <1/> مدرستي جميلة ونظيفة ومتطورة <1> 
- جعله خط عريض 'مدرستي جميلة ونظيفة ومتطورة". 
يكتب الكود: <8/> مدرستي جميلة ونظيفة ومتطورة <ط> 


۳ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


ثانيا : تنسيق خلفية صفحة الوبب: 


١-تحديد‏ لون كخلفية لصفحة الويب bgcolor‏ 


تستخدم الخاصية ٠96010917‏ التابعة للأمر <لا500> لتحديد لون خلفية صفحة الويب. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بعمل الآتى: 


.<body bgcolor='green' > -كتابة الكود‎ 


<html> .11600 حفظ الملف النصي بامتداد‎ - 
<head> e 
</head> سي‎ E oT 
<body bgcolor="green" > الويب باللون الأخضر.‎ 

< / body> م‎ ‘KETE 7 TT CL 


</html> 


- الجدول التالي يحتوي بعض أسماء الألوان يمكن استخدامها كقيمة للخاصية 6060101: 


E‏ ف 1١!‏ !1 ! طلست 


Color Blue Brown Black Green Red White | Yellow 
Name 


Sky 


Blue 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۹4 


وزارة التربية والتعليم 


”- وضع صورة كخلفية لصفحة الويب Background‏ 


لوضع صورة كخلفية لصفحة الوبب تستخدم الخاصية 83610100160 التابعة للأمر <لاكءهط>. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بتنفيذ مايلى: 
- إعداد وتجهيز أحد ملفات الصور لوضعها كخلفية لصفحة الويب. 
- حفظ ملف الصورة داخل مجلد. 
- كتابة الكود اللازم لوضع الصورة 1.٥9"‏ 96آ" كخلفية لصفحة الويب 
<body background="image 1.jpg" >‏ 
- حفظ الملف النصي بامتداد ٣٤۳‏ فى نفس مجلد حفظ ملف الصورة. 
<html>‏ 
ا ¬ <head>‏ 
| © - 2 الاشةاضاههاثائية ع0 _. |( </head>‏ 


<body background="image1.jpg" > 


</body> 
</html> 


كتابة الكود في أحد برامج تحرير النصوص 


4 الصف الثاني الإعدادي 


وزارة التربية والتعليم 


التعامل مع الصور في صفحات الويب: 
١-ادرا<ء‏ ة داخل صفحة الويب 


لإدراج صورة في صفحة الويب يتم استخدام خاصية 5866 التابعة للأمر <100> ويتطلب ذلك تحديد 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بتصميم صفحة ويب يكون محتواها كالآتي: 


- نص "مدرستي جميلة ونظيفة ومتطورة" بلون أحمر وتحتها خط. 


- تظهر صورة للمدرسة أسفل النص. 
<html>‏ 
<head>‏ 
</head>‏ 


<body > شا‎ RT 
<font face="andalus" color="red" ا <"6"دع512‎ 
مدرستي جميلة ونظيفة ومتطورة (0ا/» مدرستي جميلة ونظيفة ومتطورة <لا)‎ 
(</font> 

! (br> ٠ 

` (/body> 
</htnl> 


ا ay‏ 
كتابه الكود في أحد برامج تحرير النصوص 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات 1 


وزارة التربية والتعليم 


| تدريب ء 
ر تيت | عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بالبحث عبر الإنترنت عن أنواع 
امتداد ملفات الصور التي يمكن استخدامها في صفحات الويب. 
ملاحظات هامة: 


- في التدريب السابق يفترض أن ملف الصورة وملف صفحة الويب في نفس المجلدء لذلك تم الإكتفاء 
بكتابة اسم ملف الصورة والإمتداد مع الخاصية ©!51. 
- فى حالة تواجد ملف الصورة فى مجلد آخر يجب كتابة مسار ملف الصورة كاملا. 


كت د 5 ئی صفحات الوس : 


١-٣‏ التحكم في أبعاد الصورة بصفحة الويب 


يمكن تنسيق الصورة المدرجة بالتحكم في ابعادها (الارتفاع والعرض) ومحاذاتها بالنسبة لصفحة الويب. 
يتم التحكم في أبعاد الصورة من خلال خصائص الأمر <1179> كالآتي : 

- الخاصة 561914 (ارتفاع الصورة). مثال '200"=٤وhei‏ 

- الخاصية 2/1041 (عرض الصورة)ء مثال "300"-104/لا 


وتم استخدام وحدة القياس البكسل "Pixel"‏ لقياس ابعاد الصورة. 


۹۷ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


0 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بالآتي: 
- إدراج صورة مع جعل ابعادها كالآتي: 
العرض 1011/ا-800 بكسل » الارتفاع 450-1610911 بكسل 
- تعديل النشاط السابق بحيث يتم كتابة الكود التالي: 
<img src="school.png' height="450' width="§00'>‏ 


(html) 
(head? 
(/head> 


(body > 

(font face="andalus" color="red" size 

مدرستي جميلة ونظيفة ومنطورة 

2/01 

(br> | 

«img srez="shool, jpg" hieght="450" width="800"> | 
(body 

(</html> 


صفحة الويب بعد تنفيذ الكود كتابة الكود في أحد برامج تحرير النصوص 


وزارة التربية والتعليم 


۲-٣‏ محاذاة الصورة داخل صفحة الويب 


يتم التحكم قي محاذاة الصورة من خلال الخاصية 611901 للأمر <و”ا>» وتأخذ الخاصية القيم الآتية: 


القيمة الوظيفة 
Right‏ محاذاة الصورة لأقصى يمين صفحة الويب 
Left‏ محاذاة الصورة لأقصى يسار صفحة الوبب 
Middle‏ النص يقع بمحاذاة منتصف الصورة 
Bottom‏ النص يقع بمحاذاة الحافة السفلى للصورة 


Top‏ النص يقع بمحاذاة الحافة العليا للصورة 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بالتعديل في ملف صفحة الويب بالتدريب 
السابق كالتالي: 
- تنسيق الصورة لكي يظهر النص مع الصورة في نفس السطرء ويقع النص بمحاذاة منتصف الصورة. 
- حفظ الملف النصي بامتداد 5400. 


- فتح الملف في مستعرض الإنترنت. 


۹۹ الصف الثاني الإعدادي 


وزارة التربية والتهليم 


<html> 

mrn A emai] |‏ ی 
<body <‏ 

<font face="andalus" color="red 
دراي بل ويف رارز مدرستي جميئة ونظيفة ومتطورة‎ 

</font> | 
<br> 


<img src="shool. jpg" ETE ddle"> 


DOQdV 


صفحة الوبب بعد تنفيذ الكود </html>‏ 


: كتابة الكود فى أحد برامج تحرير النصوص 


ويقع النص بمحاذاة منتصف الصورة 


تدريب | 
ققدي عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك في النشاط السابق قم بعمل 


الآتي: 
- محاذاة الصورة لأقصى اليمين لصفحة الوبب. 
- محاذاة الصورة ليقع النص بمحاذاة الحافة العليا للصورة. 


ملاحظات: 


- لمحاذاة الصورة لأقصى اليمين لصفحة الويب نستخدم الكود '21014'-311011. 
- لمحاذاة الصورة ليقع النص بمحاذاة الحافة العليا للصورة نستخدم الكود "م00"-21!01. 


الكمييوتر وتكنولوجيا المعلوعات والاتعالات ۰۸۰ 


وزارة التربية والتعليم 


التعامل مع الصوت في صفحات الويب: 


إدراج الصوت كخلفية صوتية لصفحة بالأمر <05010110> 


ملاحظة: 

برنامج مستعرض الإنترنت ' ۲۲۲هام×٤‏ 10461764 " هو المستعرض الوحيد الذي يدعم تنفيذ الأمر 
<595010110> لإدراج الصوت كخلفية صوتية لصفحة الويب ولا يظهر تأثير هذا الأمر مع الأنواع الأخرى 
من المستعرضات. 

باستخدام الأمر <69501010> والخاصية ١٠٠۲ء‏ المصاحبة له. يتم إدراج الصوت كخلفية صوتية 
لصفحة الويب» الخاصية 5866 للأمر تأخذ قيمة اسم ملف الصوت وامتداده (وذلك في حالة حفظ ملف الصوت 
مع ملف صفحة الويب في نفس المجلد» وغير ذلك يجب كتابة مسار ملف الصوت كاملاً). 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بإنشاء صفحة ويب عند فتحها داخل 
المستعرض "27101761 17161764" يتم تشغيل ملف الصوت "1.1/23لاو0»" كخلفية لصفحة الوبب. 


ت تنفيذ النشاط: <html>‏ 
- كتابة الكود كما هو موضح بالصورة. <head>‏ 
- حفظ الملف النصي بامتداد 400. </head>‏ 


<body > 
<besound src= 
</body> 
</html> 


كتابة الكود في أحد برامج تحرير النصوص 


مل الصف الثاني الإعدادي 


وزارة التربية والتهليمع 


التعامل مع الفيديو داخل صفحة الويب: 


إدراج فيديو داخل صفحة الويب بالأمر <0ع1اع> 


باستخدام الأمر <800660> يتم إدراج الفيديو في صفحة الويب» ويجب ملاحظة أن هذا الأمر يدعم 
ملفات الفيديو من النوع (/5001. - ألاق. - آللاك.) 


باستخدام الأمر <617860> والخاصية ١۲ء‏ المصاحبة له. يتم إدراج الفيديوء قيمة الخاصية 5۲٥١‏ 
تأخذ اسم ملف الفيديو وامتداده (وذلك في حالة حفظ ملف الفيديو مع ملف صفحة الويب في نفس المجلدء 
وغير ذلك يجب كتابة مسار ملف الفيديو كاملاً). 


عزيزق الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بإنشاء صفحة ويب تحتوي على فيديو حيث 


يمكن تشغيل ملف الفيديو 1.31/1 116116 بداخلها. 


<html> 
<head> 
</head> 


<body > 


<embed src="internet.avi"> 


</body> 
</html> 


كتابة الكود في أحد برامج تحرير النصوص 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۱۰۴ 


وزارة الثربية والتعليم 


إدراج ارتباط تشعبي بصفحة الويب بالأمر <2<...>/23> 


الارتباط التشعبى )!اا :Hype‏ 
الارتباط التشعبي عبارة عن صورة أو نص مرتبط بعنوان وعند الضغط عليه يتم الانتقال إلى هذا 
العنوان ويمكن أن يكون داخل نفس الصفحة أو بصفحة أخري داخل نفس الموقع أو في موقع آخر. 


ندريب 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بالتالي: 

- تحميل موقع وزارة التربية والتعليم. 

- البحث داخل صفحات الموقع عن الارتباطات التشعبية (نص فائق أو صورة فائقة). 

- تتبع تلك النصوص والصور الفائقة من خلال الضغط عليها. 

- تعرف على الأشكال المختلفة للارتباط التشعبي (في نفس الصفحةء بين صفحات الموقع» بين صفحة 
بالموقع وارتباطها التشعبي بصفحة أخرى في موقع آخر). 


۱۰۴۳ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


ادراج ارتباط تشعبي كان ذاعم لا!!: 


لإدراج ارتباط تشعبي تستخدم الخاصية "۲٠۴‏ للأمر <3> والتي تحدد قيمتها العنوان المطلوب الانتقال 
إليه» ويكون شكل الأمر كالآتي: 
<3/> النص أو الصورة < "العنوان المطلوب الانتقال إليه"  "١١‏ 2> 


١-إدراج‏ ارتباط تشعبي نصي الأمر <2<...>/3> 


لإدراج ارتباط تشعبي نصي (نص فائق) باستخدم الخاصية 1:87 للأمر <ه>. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بإنشاء صفحة وبيب تحتوي ارتباط تشعبيى 
نصي 'وزارة التربية والتعليم" وعند الضغط عليه يتم الإنتقال للصفحة الرئيسة لموقع وزارة التربية والتعليم. 
إستخدم الكود التالي في انشاء الصفحة: 


<3/> وزارة التربية والتعليم < so.‏ ل ا <a ref RR‏ 


بط كص نا 0 
د e‏ ا 
الويد aE‏ 


<a href=.....> ...</a> |] أمر الارتباط التشعبي‎ 


الكعبيوتر وتكنولوجيا المعلوهمات والاتصانات ل 


وزارة القربية والتعليم 


خطوات إنشاء وتتفيذ ارتباط تشعبي على هيئة نص 


١-كتابة‏ الكود في أحد منسقات النصوص وحفظه. 
؟-فتح صفحة الويب في المستعرض› 
*- الضغط على النص الفائق بصفحة الويب. 
؛ -فيتم تحميل موقع وزارة التربية والتعليم. 
211 
<head>‏ 
١-كتابة‏ الكود في أحد (/head>‏ 
منسقات النصوص وحفظه؛ 
<body >‏ 
(3/كوزارة التربية والتعليم< (a href=" http: //I, 10€ , £0۷, e"‏ 
</body>‏ 
(/htnl>‏ 


سوام رزارد كتريية رهم 


؟-فتح صفحة الويب في المستعرضء وعند 
الضغط على النص الفائق يتم تحميل موقع 
الوزارةء على أن يراعى أن يكون الجهاز 
متصلا بشبكة الإنترنت. 


- تحميل موقع الوزارة. 


ه66٠‏ الصف الثاني الإعدادي 


وزارة التربية والتعايم 
تابع إدراج ارتباط تشعبي 1|121 م ۸y‏ : 


”-إدراج ارتباط تشعبي لصورة 


لكي تصبح صورة ارتباط تشعبي يجب اتباع التالي: 
- إظهار الصورة باستخدام الأمر <وصا>. 
- وضع أمر الصورة <1170> داخل الأمر <3/>... <3> وذلك لتحويلها إلى ارتباط تشعبي. 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك قم بإنشاء صفحة ويب تحتوي ارتباط تشعبي 


صورة وعند الضغط على الصورة يتم الانتقال الي صفحة الويب 'مدرستي". 
خطوات تنفيذ النشاط 


بالتعديل في كود صفحة الويب السابقة واستبدال النص بالصورة "0015.109" بحيث تصبح ارتباط 
تشعبي وبالنقر عليها يتم الانتقال الي صفحة الويب 'مدرستي'. 
استخدم كود الارتباط التشعبي لصورة كالتالي: 


<a href = 'myschool.htm'" > <img src="tools.jpg'> </a> 


تظهر كصورة فائقة عنوان صفحة ويب 
E‏ المطلوب الانتقال إليه 


أمر الارتباط التشعبي | <3/>... < 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۱۰ 


وزارة التربية والتعليم 


خطوات إنشاء وتنفيذ ارتباط تشعبي بإستخدام صورة 


١-كتابة‏ الكود في أحد منسقات النصوص وحفظه. 
؟-فتح صفحة الويب في المستعرضء وعند الضغط على الصورة الفائقة يدم تحميل صفحة ويب 'مدرستي '. 
"-يتم تحميل صفحة ويب 'مدرستي '. 


<html> 
<head> 
</head> الكود في أحد‎ ةباتك-١‎ 
منسقات النصوص وحفظه.‎ 
<body > 
` <ahref = 'myschool.htm’ > <img src=’ tools.jpg'> </a> 
1 <body> 
<html> 


”-فتح صفحة الويب في المستعرض» 
وعند الضغط على الصورة الفائقة يتم 
تحميل صفحة ويب مدرستي 


وزارة التربية والتعليم 


تذکر أن : 


بعض أوامر 111/1! لإنشاء صفحة وبب التالى: 


<html> 


<head> 


<body> 


<title> 


<þr> 


<center> 
الرمز :م5125‎ 
<font> 
<u> 
<b> 
<i> 


<img> 


E 
.ط٤۳١ مكتوب بلغة‎ 

المنطقة الخاصة بكتابة معلومات للمتصفح عن 
الصفحة مثل عنوان الصفحة. 


المنطقة الخاصة بكتابة المحتوى الذي سيظهر 
داخل الصفحة. 


تحديد عنوان لصفحة الوبب. 


٠‏ انهاء الكتابة في السطر الحالي ويدء الكتابة في 


ادراج فراغ (مسافة) بين الكلمات على المستعرض. 


للتحكم في تنسيق الخطوط. 
وضع خط تحت الكتابة. 
خط اسود عريض. 


خط مائل. 


لإظهار صورة على صفحة الوبب. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات 


dir — bgcolor - 


background 


face-color-size 


src-height-width — 


align 


۱٩۸ 


وزارة التربية والتعليم 


الأمر 
<bgsound>‏ 


<embed> 


<a> 


۱۰۹ 


وظ + 


د 


لإدراج صوت كخلفية للصفحة 


إضافة صوت أو فيديو لصفحة الويب 


لإنشاء ارتباط تشعبي 


الصف الثاني الإعدادي 


وزارة التربية والتعليم 


الأسيلة والنارييان 


السؤال الأول: اختر الإجابة الصحيحة المناسبة للعبارات الآتية: 
)١(‏ يشير الإختصار ا1۲1 الى العبارة 
أ- .Hyper Text Markup Library‏ 
ب- .Help Table Made Layout‏ 
ج- .Hyper Text Markup Language‏ 


(۲) صفحة الويب التي يتم استخدام لغة ا١١1‏ فقط في تصميمها تعتبر صفحة 
أ- تفاعلية. 
ب-ن نشطة. 


ج- ثابتة. 


(۳) استخدام لغات مثل 317/3561104ل و ۴١۴‏ بالإضافة للغة 1١۷1‏ في تصميم صفحة الويب يكون 


)٤(‏ لإظهار نص علي صفحة الويب يتم كتابة هذا النص في منطقة 
أ- .Head‏ 


.Title ب-‎ 


.Body ج-‎ 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۱1۰ 


وزارة القربية والتعليم 


(5) يجب حفظ ملف أوامر ا1۲ بالإمتداد 
ا 


.Docx - 


0 لتحديد لون كخلفية لصفحة الويب نستخدم الخاصية 
أ- bgcolor‏ 
ب-01010110كا 36 


color ج‎ 


(۸) الخاصية التي ترتبط بأمر <11090> من بين الخصائص التالية هى الخاصية 
أ- path‏ 
ب - href‏ 


SrC 


)٩(‏ الأمر <4> يستخدم فى 
أ- محاذاة النص. 
ب- اضافة ارتباط تشعبي. 
ج- تشغيل فيديو. 


۱111 الصف الثاني الإعدادي 


وزارة التربية والتعليم 


)٠١(‏ لتحديد نوع الخط في الأمر <أ١٥؟>‏ نستخدم الخاصية 


Fontname أُ-‎ 


ب-ع512 


( ) مستند به محتوي الكتروني ينشر على شبكة الإنترنت ويتم 
عرضه من خلال برنامج مستعرض الإنترنت 

؟ - الصفحة الرئيسة ( ) تعرض معلومات يتم الإطلاع عليها فقط بدون امكانية 

اجراء اي معالجة من الزائرين لمحتواها 

*- صفحة الويب ( ) مكان علي شبكة الانترنت يتكون من صفحة ويب او أكثر 

ويتم زيارته من خلال عنوان معين 

4 - الصفحة الثابتة ( ) أول صفحة بموقع الويب والتي من خلالها يسهل الإنتقال 

لباقي صفحات الموقع 

ه - الصفحة التفاعلية ( ) هي خاصية للتنقل بين صفحات الموقع 


( ) هي صفحة معلومات تعرض محتوي يتيح للزائرين التفاعل 


)١(‏ تستخدم لغة ا١1‏ في انشاء صفحات وبب تفاعلية. 
(۲) تستخدم لغة 37/2356©1104ل لتحويل الصفحة الثابتة الى صفحة تفاعلية. 
(۳) الأمر الذي يكتب في بداية الكود ليشير الى أن المستند مكتوب بلغة 514101 هو 


.<title> 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۱1۲۴ 


وزارة التربية والتعليم 
4) للتحكم في عدد المسافات (الفراغات) بين الكلمات نستخدم الرمز :م615. 


(5) لإضافة صورة لصفحة الويب نستخدم الأمر <1500>. 


السؤال الرابع: أذكر الكود الأساسي اللازم لبناء ملف أوامر ا۷ 1۲؟ 


<img src="school.png'> 
على الرغم من عدم وجود أخطاء في سطر الكود السابق إلا ان الصورة لم تظهر على صفحة الويب عند‎ 
تحميلها بواسطة المستعرض. استنتج السبب؟‎ 


يتم الإجابة على الأسئلة من خلال: 
برنامج ۷٥۲١‏ 5الاا من ملف "إجابة الدرس الرايع" بمجلد ( قالب الإجابة والمشروعات). 


١‏ الصف الثاني الإعدادي 


وزارة الثربية والتعليم 


الموضوع الثاني 
المننتروعات 


۱1٥‏ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


المشتتروع الأول 
ها الروع تد بی التصهييم هسوهم وريب 
"موقع مدر سني" 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۱۱٩‏ 


وزارة التربية والتعليمع 


الأهداف 
بعد الإلتهاء من هذا المللازوع يتوقع أن يكون الطالب قاداً على 


يحدد عدد صفحات الموقع من التخطيط التفصيلي لموقع الويب. 
ينشئ صفحات الموقع المختلفة بلغة ا ا/ا1!!. 


يدرج ارتباط تشعبي بين صفحات الموقع. 


۱1۷ الصف الثاني الإعدادي 


وزارة التربية والتعليم 


إنشاء مشروع "موقع مدرستي" 


مدر ستي 


.6 ع ١‏ 1 
عن المدرسة الرؤية والرسالة 
تاريخ نشأة المدرسة: ... E 2 EES‏ رؤية المدرسة: 
عنوان المدرسة: ....__تليفون المدرسة: ... ا 1 و إعداد طالب متميز قادر على 
ehh‏ 8 ازس 
تنمية مهارات الطالب 


.هام ليط ته يلي !ا 03 ع 'موقع مدرستي" 
+©؟©١؟؟ن‏ >2 م لي 


إنشاء موقع مدرستي: 
- من التخطيط التفصيلي للموقع يتضح أنه مكون من خمس صفحات ويب وهي كالآتي: 
. صفحة الويب الرئيسة 'مدرستي" تُحفظ بداخل ملف10776.1407]. 
. صفحة الويب "عن المدرسة" تُحفظ بداخل ملف 2300101.11407. 
. صفحة الويب 'ألبوم الصور”" تُحفظ بداخل ملف 01010.1417. 
. صفحة الويب "الرؤية والرسالة" تُحفظ بداخل ملف 151017.5417لا. 
- وسوف يتم إنشاء وحفظ كل صفحة ويب داخل ملف نصي باستخدام أوامر ا۷ 1۲. 


الكمبيوتر وتكنولوجيا المعلومات والاتصالات ۱1۸ 


وزارة التربية والتعليم 


تتكون صفحة الويب الرئيسة من الآتي: 


- النص "مدرستي" الخط (لونه أحمر - نوعه 1910173 - حجمه .)١‏ 


- خمسة ارتباطات تشعبية نصية. 
- صورة. 
كود صفحة الويب 'الرئيسة" كالآتى: 


<head> 

<1616]/|>مدرستي<01616> 

</head> 

<body bgcolor="skyblue'" dir='rtl'> 

<center> 

<font face=-"'tahoma'’ color="red’ size="6'> >مدرستي‎ /font> 
<br> 

<font face-"andalus'" color=' purple" size="5'> 

<a الصفحة الرئيسية< غط.ع مط" عط‎ >/a<& nbsp; &nbsp; 
<a href="about. ht m'>ûıردملا عن‎ </a> &nbsp; &nbsp; 
<a href-"photo.hm'>رgصll ألبوم‎ </a>&nbsp; &nbsp; 
<a href-="photo. 247 الرؤية والرسالة<'‎ </a>&nbsp; &nbsp; 
<a href='"contact. ht m'>liڊ <2/>اتصل‎ 

<br><br> 

<img src-"school.png’ height="450" width-"800'> 
</center> 

</body> 

</html> 


وزارة التربية والتهليم 


إنشاء صفحة الويب " عن المدرسة " ".utهطa‏ 


تتكون صفحة الويب ' عن المدرسة" من الاتي: 
0 النصوص: "تاريخ نشنه المدرسة yT‏ عنوان المدرسة" كيد '"تليفون المدرسة" 
الخط (لونه أحمر - نوعه 6310173 - حجمه 5). عن المدرسة 


تاريخ نشأة المدرسة: ... 
عنوان المدرسة: .... تليفون المدرسة: ... 


- فيديو. 


- ارتباط تشعبي صورة (عند الضغط عليه يرجع للصفحة الرئيسة). 


كود صفحة الويب "عن المدرسة" كالاتي: 


<html> 
<head> 
<118]/>مدرستي<01618>‎ 
</head> 
<body bgcolor="skyblue'" dir='rtl'> 
<center> 
<font face-"andalus’ color="red" size-"6'> 
<:ط> عن المدرسة‎ 
تاريخ نشئه المدرسة‎ >61< 
<1ط>عنوان المدرسة: القاهرة - السيدة زينب‎ 
١١4ه‎ 51/815 التليفون:‎ >< 
<51>المرحلة: تعليم أساسي‎ 
<embed src="video.mp4" height=300° "01-300آنلا‎ > 
<br><br> 
<a href="home.htm'><img src=-"back.jpg’ height=100° width=" 100'></a> 
</center> 
</body> 
</html> 


العهبيوتر وتكنولوجيا المعلوعات والاتعالات حل 


وزارة القربية والتعليم 


إنشاء صفحة الويب " ألبوم الصور " 1010.11611م 


تتكون صفحة الويب ' عن المدرسة" من الآتي: 

- النص ألبوم الصور' 

الخط (لونه أحمر - نوعه 1810173 - حجمه 5). 

- عدد ۳ صور. 

- ارتباط تشعبي صورة (عند الضغط عليه يرجع للصفحة الرئيسة). ى 
كود صفحة الويب "عن المدرسة" كالاتي: 


<body bgcolor="skyblue'> 

<center> 

<font face-"tahoma'’ color="red" size-="6'> 

<١ط>ألبوم‏ الصور 

<img src-"students.jpg’ height="400'° width="300'> 

<img src-'"teachers.jpg’ height="400° width="300'> 

<img src-'yard.jpg’ height="400'° width="200'> <br> 

<a href='home.htm' ><img src=-'"back.jpg’ height=" 100° width="100'></a> 


۱1 الصف الثاني الإعدادي 


وزارة التربية والتهليم 


إنشاء صفحة الويب " الرؤية والرسالة " vision.htm‏ 


تتكون صفحة الويب " الرؤية والرسالة" من الاتي: 
- النص "الرؤية والرسالة" 


الرؤية والرسالة 


رؤية المدرسة: 
الخط (لونه أحمر - نوعه 4310173 - حجمه .)١‏ إعداد طالب متميز قادر على .... 


الرسالة: 


- النص ارؤية المدرسة تنمية مهارات الطالب 


الخط (نوعه 13150173 - حجمه .)٤‏ 


كود صفحة الويب "الرؤية والرسالة" كالاتي: 


<body bgcolor="skyblue'> 
<center> 


<font face-"tahoma'" color="red” size—-"6'> 


الععبيوتر وتكنولوجيا المعلوعات والاتعالات فك 


وزارة القربية والتعليم 


المتتتروع ! 


. 
3 


الصف الثاني الإعدادي 
۱۴ 


وزارة التربية والتعليم 


عزيزى الطالب: بالتعاون مع زملائك وبمساعدة معلمك صمم وانشئ التالي: 


موقع الويب -صفحة الويب-الصفحة الرئيسة-صفحات الويب الثابتة -الصفحة التفاعلية. 


- خطوات إنشاء ملف صوت وهي كالتالي: 
أولاً: الإعداد والتجهيز. 
ثانياً: التنفيذ لإنشاء ملف الصوت. 
ثالثاً: التعديل في الصوت. 
رابعاً: تصدير الصوت إلى ملف. 


- خطوات إنشاء الفيديو. 

- خطوات حفظ مشروع الفيديو 52170[6614 53176. 
- خطوات تعديل مشاهد الفيديو. 

- خطوات تصدير الفيديو إلى ملف بامتداد مناسب. 


٠‏ موقع الويب: 
هو مكان على شبكة الانترنت يتكون من صفحة ويب أو أكثرء يتم زيارته من خلال عنوان معين. 
کے یی 
هي مستند به محتوى إلكتروني ينشر على شبكة الإنترنت ويتم عرضه من خلال برذامج مستعرض 
الإنترنت. 
٠ه‏ الصفحة الرئيسة: 


هي أول صفحة بموقع الويب والتي من خلالها يسهل الانتفال لباقي صفحات الموقع. 


وزارة التربية والتعليم 


القواعد الأساسية التالية لإنشاء صفحة ويب باستخدام أوامر 111/11!. 
التركيب البنائي لإنشاء صفحة ويب بأوامر -11/م11ا. 


إضافة محتوى لصفحة الويب (نص-صورة - فيديو -ارتباط تشعبي-...) 
تنسيق محتوى صفحة الوبب. 
إدراج ارتباط تشعبي للإنتقال داخل صفحة الويب / بين صفحات الموقع 


